Vue 3 SFC v-model

Child.vue

<script setup>

const props = defineProps({
  modelValue: String
})

const emit = defineEmits(['update:modelValue'])

function updateValue(value) {
  emit('update:modelValue', value)
}
</script>


<template>
  <input
    type="text"
    :placeholder="props.label"
    :value="props.modelValue"
    v-on:input="updateValue($event.target.value)"
  />
</template>

Parent.vue

<script setup>
import { ref } from 'vue'
import Child from './Child.vue'

const name = ref('')
</script>

<template>
  <Child v-model="name"/>
  <p>{{ name }}</p>
</template>