-
todolist 简单功能实现查看全部
-
v-for=“(index,key,value) in list”查看全部
-
v-if v-show 控制标签的显示和隐藏，当为false时，前者销毁dom，后者隐藏dom，所以频繁使用时推荐后者。查看全部
-
侦听器watch 监听数据变化，一旦变化则调用侦听器内函数查看全部
-
计算属性computed 某变量依赖其他变量而改变查看全部
-
挂载点、模板、实例的概念查看全部
-
v-html不会转义,v-text会转义 v-on:click 可以简写为@click methods内为函数查看全部
-
v-bind: 是属性绑定，将数据绑定到组件上，可以简写为: v-model是双向绑定，数据和显示可同时变化。查看全部
-
子组件自定义一个事件，传值给父组件，父组件监听子组件自定义的事件对传入的值进行处理
查看全部 -
3-4 实现todolist的删除功能
核心任务：如果要删除子组件，目的是删除父组件中的相关数据。
在vue中，子组件向父组件传值，是通过$emit方式： 发布订阅模式
查看全部 -
3-4 实现todolist的删除功能
在vue中，父组件向子组件传值，是通过属性方式： Vue-->todo-itme
查看全部 -
3-3 组件与实例之间的关系
每一个组件本身也是一个vue实例，一个项目是由大量的vue实例组成。
证明：
查看全部 -
3-2 todolist组件拆分
查看全部 -
3-1 todo-list功能开发
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Todo</title> <script src="vue.js"></script></head><body> <div id="demo"> <input v-model="inputValue" type="text" name="" id=""> <button @click="handleSubmit" >提交</button> <ul> <li v-for="(item,index) of list" :key="index"> {{item}} </li> </ul> </div> <script> new new Vue({ el:"#demo", data: { inputValue: "hello", list: [] }, methods: { handleSubmit: function(){ this.list.push(this.inputValue); this.inputValue="" } } }) </script></body></html>查看全部 -
2-6 v-if, v-show, v-for
:key="index"提升性能
用index有时会出问题，主要是表现在频繁变换顺序时
查看全部
举报
0/150
提交
取消