Vue表单demo v-model双向绑定问题

具体代码如下所示:

<div id=\"app\">
 <textarea v-model = \"message\" placeholer = \'请在此输入文字\'></textarea>
 <span>{{message}}</span>
  </br>
 <input type=\"text\" v-model=\"data.name\"/>
 <span>姓名:{{data.name}}</span>
 </br>
 <input type=\"radio\" id=\"boy\" value=\"男\" v-model=\"data.gender\"/>
 <label for=\"boy\">男</label>
 <input type=\"radio\" id=\"girl\" value=\"女\" v-model=\"data.gender\"/>
 <lable for=\"girl\">女</lable>
 <span>{{data.gender}}</span>
 <br/>
 <input type=\"checkbox\" id=\"item1\" value=\"阅读\" v-model=\"data.interest\"/>
 <lable for=\"item1\">阅读</lable>
 <input type=\"checkbox\" id=\"item2\" value=\"打球\" v-model=\"data.interest\"/>
 <lable for=\"item2\">打球</lable>
 <input type=\"checkbox\" id=\"item3\" value=\"体操\" v-model=\"data.interest\"/>
 <lable for=\"checkbox\">体操</lable>
 <br/>
 <span>{{data.interest}}</span>
 <select v-model=\"data.identity\">
  <option value=\"java\" selected>java</option>
  <option value=\"web\">web</option>
  <option value=\"hr\">hr</option>
 </select>
 <span>身份:{{data.identity}}</span>
</div>
<script src=\"js/vue.js\"></script>
<script>
 new Vue({
  el: \'#app\',
  data: {
   message: \'6\',
   data: {
    name: \'\',
    gender: \'\',
    interest: [],
    identity: \'\'
   },
  }
 })
</script>

以上所述是小编给大家介绍的Vue表单demo v-model双向绑定问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容