如何利用Vue.js库中的v-model绑定表单中的数据

2024-11-30 19:16:45
推荐回答(2个)
回答1:

第一步,创建静态页面vtext.html,修改title显示的内容并引入vue.js,如下图所示:

第二步,在body标签元素内插入两个span元素,在第一个span绑定v-text指令,第二个span中插入{{message}},如下图所示:

第三步,编写JS代码,绑定数据源message,如下图所示:

第四步,预览静态页面vtext.html,发现{{message}}还是一样,未变成赋的值,如下图所示:

第五步,在两个span外层添加一个div,并将第一个span的id赋给div,再在第一个span标签上绑定v-model,如下图所示:

第六步,再次预览发现页面中的{{message}}变为绑定的数据源,如下图所示:

回答2:

data中创建一个属性i。 li注册一个click事件并把$index的值传进去,在这个事件中把i赋值为$index。 然后li的v-bind:class="{classname: i==$index}"