<div id="app">
<div class="box">
name:<input type="text" v-model="name">
text:<input type="text" v-model="text">
<button @click="go">提交评论</button>
</div>
<ul>
<li v-for="item in list" :key="item.id">
{{item.text}}<span>{{item.name}}</span>
</li>
</ul>
</div>
<script>
var vm=new Vue({
el:'#app',
data:{
text:'',
name:'',
list:[
{ id: Date.now()-5,name:'张三',text:'我叫张三'},
{ id: Date.now()-4,name:'李四',text:'我叫李四'},
{ id: Date.now()-3,name:'王五',text:'我叫王五'}
]
},
mounted:function(){
var l=JSON.parse(localStorage.getItem('cnm')||'[]')
this.list=l;
},
methods:{
go:function () {
var now= {id:Date.now(),name:this.name,text:this.text}
var list=JSON.parse((localStorage.getItem('cnm') || '[]'))
list.unshift(now)
localStorage.setItem('cnm',JSON.stringify(list))
this.list.unshift(now)
this.text=this.name=''
}
}
})
</script>