- v-on:click 添加一个事件监听器
- v-for=“数组” 绑定数组的数据渲染一个项目列表
- this.todos[e].text 当前点击事件中,数据项的值
- reverse 将一个元素的值反转输出
<div id="app">
<ol>
<li v-for="(todo,index) in todos" v-on:click="reverseMessage(index)">
{{todo.text}}
</li>
</ol>
</div>
var app1= new Vue({
el:'#app',
data:{
message:'页面加载于 '+new Date().toLocaleString(),
todos:[{text:'学习'},{text:'工作'},{text:'下山去玩玩'}]
},
methods:{
reverseMessage:function(e){
console.log(this.todos[e].text)
this.todos[e].text=this.todos[e].text.split('').reverse().join('');
}
}
})