Vue中v-model和v-bind:value的区别

以input为例

一、Vue中v-model和v-bind:value的区别

1.v-model

 //HTML
  <div>
      <input type="text" placeholder="请输入值model" name="" id="" v-model="msg">
      <div>{
  {msg}}v-model绑定</div>
   </div>
//JS
  export default {
  data() {
    return {
      msg:""
    }
  },

当修改输入框中的数据改变时，data中的msg也会跟着变化，所以上下都是显示的"123456" 

2.v-bind:value

  //html
 <div>
     <input " type="text" placeholder="请输入值vaue" name="" id="" v-bind:value="msg1">
     <div>value绑定:{
  {msg1}}</div>
  <