Как представить v-модель дочернего элемента как v-модель vue-компонента - PullRequest
Новая
       7

Как представить v-модель дочернего элемента как v-модель vue-компонента

0 голосов
/ 09 ноября 2018

Я использовал простую текстовую область в моем компоненте vue. 

<input v-model="someRootProperty"/>

Я бы хотел инкапсулировать этот ввод в другой компонент, например 

<template>
    <div>
        <div>...</div>
        <input v-model="???"/>
    </div>
</template>

Я хотел бы использовать 

<my-component v-model="someRootProperty" />

вместо этого, и они пропускают это на вход внутри компонента.

Что я должен сделать внутри компонента, чтобы представить его входную v-модель как v-модель компонента?

1 Ответ

0 голосов
/ 09 ноября 2018 
<input v-model="someRootProperty"/>

То же самое, что (синтаксический сахар): 

<input :value="someRootProperty" @input="someRootProperty = $event.target.value"/>

Это означает, что вы можете принять value в качестве опоры в компоненте и выдать input для достижения того же самого.

MyComponent.vue 

<template>
  <input :value="value" @input="$emit('input', $event.target.value)>
</template>

<script>
export default {
  props: ['value']
}

А потом используйте это так. 

<my component v-model="someRootProperty"/>
...