v-model 双向绑定

<template>
  <div class="about">
    <input v-model="message" /> //改变输入框文字div内的文字会直接改变
    <div class="message">{{ message }}</div>
    <ul class="list">
      <li v-for="item in list" :key="item.id">
        {{item.title}} {{item.age}}
      </li>
    </ul>
  </div>
</template>
<script>
export default {
  data(){
    return{
      message:'hello worle',
      list:[{
        id:1,
        title:'张三',
        age:'1'
      },{
        id:2,
        title:'李四',
        age:'5'
      }]
    }
  }
}
</script>

  

 

posted on 2021-08-25 15:08  caicai2015  阅读(15)  评论(0编辑  收藏  举报

导航