v-model基本用法及给组件绑定多个v-model

如果需要给自定义组件绑定多个v-model，此时需要用到sync修饰符。
1、App.vue中将age传递给MyInput.vue

<MyInput :name.sync='name' :age.sync='age' />

2、MyInput.vue

<template>
  <div>
    <h1>自定义input</h1>
    <input type="text" :value="name" @input="(e)=>$emit('update:name',e.target.value)">
    <p>{{name}}</p>

    <input type="text" :value="age" @input="(e)=>$emit('update:age',e.target.value)">
    <p>{{age}}</p>
  </div>
</template>
<script>
export default {
  props: ['name', 'age']
}
</script>

原文：https://www.cnblogs.com/wuqilang/p/14874774.html

如果用到了 uni-easyinput

<login-content :mobile.sync="mobile" :msg.sync="msg" :account.sync="account" :password.sync="password"></login-content>

data() {
    return {
        mobile: '176',
        msg: '1234',
        account: '111',
        password: '234',
    };
},

login-content

<view class="login-input-box" v-show="type == 'mobile'">
    <uni-easyinput :value="mobile" @input="(e)=>$emit('update:mobile',e)"></uni-easyinput>
    <uni-easyinput  :value="msg" @input="(e)=>$emit('update:msg',e)"></uni-easyinput>
    <uni-easyinput :value="account" @input="(e)=>$emit('update:account',e)"></uni-easyinput>
    <uni-easyinput :value="password" @input="(e)=>$emit('update:password',e)"></uni-easyinput>
</view>

export default {
        name: "login-content",
        props: ['mobile', 'msg', 'account', 'password'],
}