todos 组件源码:
{{title}}
@keyup.13="addItem"
placeholder="快写下您要我记住的事吧"
autofocus="true"/>
{{index+1}}.{{todo.value}}
{{todo.created|date}}
import './assets/todos.less'
import moment from 'moment'
import 'moment/locale/zh-cn'
moment.locale('zh-cn')
export default {
name: 'app',
data () {
return {
title: 'vue-todos',
newTodo:'',
todos:[]
}
},
created(){
if(this.is_initialized){
this.todos = JSON.parse(localStorage.getItem('VUE-TODOS'))
}
},
computed:{
is_initialized(){
return localStorage.getItem('VUE-TODOS') != null
}
},
filters:{
date(val){
return moment(val).calendar()
}
},
methods:{
addItem(){
this.todos.push({
value:this.newTodo,
done:false,
created:Date.now()
});
this.saveToStore();
this.newTodo = ''
},
delItem(todo){
this.todos = this.todos.filter((x) => x !== todo);
this.saveToStore()
},
saveToStore(){
localStorage.setItem('VUE-TODOS',JSON.stringify(this.todos))
}
}
}