[IMWeb训练营作业]TodoList

export default{
name: "app",
data:function() {
return{
todos: store.fetch(),//从当地获得数据
newTodo: '',//中间数据源 于数据框绑定
editedTodo: null, //数据编辑状态
visibility: 'all',//是否已经完成

}},

watch: { // //监听数据变化并将数据保存
todos: {
deep: true,
handler: store.save
}
},

computed: {

//计算数据的状态
filteredTodos: function () {
return filters[this.visibility](this.todos);
},
remaining: function () {
return filters.active(this.todos).length;
},
allDone: {
get: function () {
return this.remaining === 0;
},
set: function (value) {
this.todos.forEach(function (todo) {
todo.completed = value;
});
}
}
},

methods: {

pluralize: function (word, count) {
return word + (count === 1 ? '' : 's');
},

addTodo: function () {

//添加数据
var value = this.newTodo && this.newTodo.trim();
if (!value) {
return;
}
this.todos.push({ title: value, completed: false });
this.newTodo = '';
},

removeTodo: function (todo) {

//删除数据
var index = this.todos.indexOf(todo);
this.todos.splice(index, 1);
},

editTodo: function (todo) {

//编辑数据
this.beforeEditCache = todo.title;
this.editedTodo = todo;
},

doneEdit: function (todo) {

//数据编辑完成
if (!this.editedTodo) {
return;
}
this.editedTodo = null;
todo.title = todo.title.trim();
if (!todo.title) {
this.removeTodo(todo);
}
},

cancelEdit: function (todo) {

//取消编辑
this.editedTodo = null;
todo.title = this.beforeEditCache;
},

removeCompleted: function () {
this.todos = filters.active(this.todos);
}
},

directives: {

//获得焦距
'todo-focus': function (el, binding) {
if (binding.value) {
el.focus();
}
}
}
}