Как значение props передать в v-model?

Question

[Daniil]

Я хочу значение props передать в v-model.
Компонент где передаю props.

<template>
    <div class="card"><CardName class="card" cardName="Меню" /></div>
</template>
<script>
import CardName from './CardName.vue';
export default {
    name: 'CardDesktop',
    components: { CardName },
    setup() {},
};
</script>

Компонент где получаю props:

<template>
    <textarea
        class="name"
        maxlength="512"
        wrap="soft"
        rows="1"
        @input="changeText"
        ref="textareaRef"
        v-model="textareaValue"
    ></textarea>
</template>
<script>
import { ref } from 'vue';
export default {
    name: 'CardName',
    props: {
        cardName: String,
    },
    setup() {
        const textareaRef = ref('');
        const textareaValue = ref('');
        const changeText = () => {
            textareaRef.value.style.height =
                textareaRef.value.scrollHeight + 'px';
        };

        return {
            changeText,
            textareaRef,
            textareaValue,
        };
    },
};

То есть я передаю например в props слово "Покупки" и оно должно записаться в v-model в textarea . Как можно такое реализовать ?

Answer 1

[0xD34F]

setup() { ---> setup(props) {

const textareaValue = ref(''); ---> const textareaValue = ref(props.cardName);