加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

vue.js实例todoList项目

发布时间:2020-12-17 02:53:41 所属栏目:百科 来源:网络整理
导读:新建组件todoList.vue,在App.vue中引入 TO DO LIST ! 三处缺一不可,第一处引入文件,第二处注册组件,第三处声明组件位置 由于html中不区分大小写,所以驼峰命名方式中的大写变为-,即第三处中写成todo-list,不理解的可以动手实验一下! todoList.vue中da

新建组件todoList.vue,在App.vue中引入

TO DO LIST !

三处缺一不可,第一处引入文件,第二处注册组件,第三处声明组件位置

由于html中不区分大小写,所以驼峰命名方式中的大写变为-,即第三处中写成todo-list,不理解的可以动手实验一下!

todoList.vue中data如下:

有三件事情:homework、run、drink water,通过v-for渲染:

  • 列表展示完成,现在添加点击列表,改变列表样式,标记为完成!

  • 添加v-on:click,v-bind:class

    v-on:click=”done(item)”表示点击执行done方法,item作为参数。

    v-bind:class=”{done:item.finish}”表示,如果item.finish==true时,class=“done”。

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

    (编辑:李大同)

    【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

      推荐文章
        热点阅读