Vue 的学习 0622

今天花了多少时间在编程的学习上: 3

今天完成的事情:

1.在完成了官网的一个小例子的仿写之后目标盯上了github上面一个抓取豆瓣电影并展示的 项目
2.理了一遍暂时对于项目的结构有点头绪,接下来需要找一个youtube的视频将过程再理一次然后自己用印象笔记总结下来, 以后照着这个路径去走。
3.上次计划的重写js的部分已经完成了,直接用codepen写的保存了在里面。
4.下面这句常用来加一的手段

    addTodo: function () {
      var value = this.newTodo && this.newTodo.trim()
      if (!value) {
        return
      }
      this.todos.push({
        id: todoStorage.uid++,
        title: value,
        completed : false
      })
      this.newTodo = '',
    }
//id: todoStorage.uid++, 这一句写法为什么能这么用
//这个写法里面this的作用

5.编辑todo标题的实现,里面的变量一用来在取消的动作中回复名字,变量2在这里实际上用做一个调整去触发相应的方法,详情见代码。市级上直接改变title就可以改变本地的值所以不需要写太多的代码

editTodo: function (todo) {
      this.beforeEditCache = todo.title
      this.editedTodo = todo
    },

6.todo-focus就是上面提到的在满足条件后执行的方法,这个是自己注册的标签,以后会用到明天写一个专题


//这句里面的v-todo-focus的作用和@blur的作用

7.这个allDone的写法set用来切换所有元素的完成值,而get则是用来在set执行之前把完成的值设为false(仅在元素完成值为true的时候需要)。不然的话在true状态下第一次点击会失效

allDone: {
      get: function () {
        return this.remaining === 0
      },
      set: function (value) {
        this.todos.forEach(function (todo) {
          todo.completed = value
        })
      }

8.这句为什么可以直接编辑

答: 这一句并不可以编辑,而是通过这一句让焦点自动聚焦在了input框里面,实际上编辑的是input而不是label

明天计划的事情:

1.参照上面提到的项目来仿写一遍。

遇到的问题:

你可能感兴趣的:(Vue 的学习 0622)