-
watch 监视模式里面有个独特的方法handler 注意要加上deep： true。不然不会读取修改的值 当值发生改变被watch监视到触发了事件 开始执行handler 把修改的值items放到封装好的函数save存储到浏览器本地存储 在data数据里面把items 默认读取浏览器的本地存储，fetch有做处理，如果没有值默认是一个空数组 1.本地存储数据的代码放置在：store.js 2.js原生存储方法：window.localStorage.setItem() , window.localStorage.getItem() 1.实时同步存储数据，使用vue.$watch观察数据的变化，从而来存储数据 2.这里deep为true,items中某一个item的键值对改变也会触发handler(),从而保存各个item的状态查看全部
-
1.@click="toggleFinish(item)"通过点击的方式来改变对象的值，函数放在methods中 2.v-model实现了一个双向的绑定，有三个限制input,select,textarea 3.<input @keyup.enter="onEnter"> v-model：随表单的不同而不同，而且是双向绑定，不管是在表单中还是data还是methods中，值的改变都是双向的。 v-on:keyup.enter:按下键盘的Enter键后执行方法 v-on事件不需要传参数时,只需写成 v-on:事件名='函数名' 不需要写成 函数名() 1.知识点：v-model双向绑定，将input输入内容通过@keyup.enter添加到items数组中 2.知识点：v-click实现下划线切换效果显示查看全部
-
1. {{}}是v-text的简写方式 <!--<h1>{{title}}</h1>--> <h1 v-text="title">{{title}}</h1> 2.v-text会把dom节点全渲染出来,v-text只渲染dom的文本节点 3.v-for的使用 4.v-bind:class="[liclass]"也存在简写的形式 5.添加class的方法，第一种是直接添加；第二种是:class="[liclass1,liclass2]"可以同时渲染两个（绑定事件），第三种是:class="{finished: item.isfinished}"（绑定事件）查看全部
-
数据展现查看全部
-
import是ES6的一个语法 import App from '/App' //与下面这行等价 var App=require('/App')查看全部
-
import App from './app' 相当于 var App = require('./app.vue') export default {} 相当于 module.export = {} data () {} 相当于 function data () {}查看全部
-
data: 代表vue对象的数据 methods: 代表vue对象的方法 watch: 设置对象监听的方法 数据渲染：v-text、v-html、{{}} html和vue对象的粘合剂 模板指令 v-if v-show 控制显示隐藏 v-if直接不显示，v-show通过css的display:none来隐藏 渲染循环列表 v-for 事件绑定 v-on methods里的方法 属性绑定 v-bind vue有三个属性，data(数据),methods（方法）,watch（对象监听）； html指令v-text(渲染数据)，v-if（控制显示），v-on（绑定时间），v-for（循环渲染） vue.js的重要选项：data (model层，对象的数据)，methods（代表vue对象的方法），watch监听设置监听的方法（）； 模板指令 - html和vue对象的粘合剂： 数据渲染 {{}}（数据双向绑定）、 v-text（格式处理了html） 、v-html（保存html结构） 控制模块的隐藏： v-if（直接不渲染dom元素）、v-show（通过css的display:none来隐藏）、 渲染循环列表: v-for 事件绑定: v-on（事件绑定与methods有关） 属性绑定： v-bind查看全部
-
vue.js组件属性 new vue({ data:{ a: 1, isShow: true, items: { { label："apple" }, { label: "pen" } } }, methods:{ doA: function () { this.a++ } }, watch:{ "a": function (val,oldVal) { console.log(val,oldVal) } } }) 模板指令 1.数据渲染 <p v-text="a"></p> <p v-html="a"></p> // 结构一并 <p>{{a}}</p> 2.控制显示 <p v-if="isShow"></p> <p v-show="isShow"></p> // display:none 3.绑定事件 <button v-on:click="doA"></button> <button @click="doA"></button> 4.循环渲染 <ul> <li v-for="item in items"> <p v-text="item.label"></p> </li> </ul> 5.属性绑定 <img v-bind:src="imageSrc"> // 字符串 <div :class="{red: isRed}"></div> // 布尔值 <div :class="[classA, classB]"></div> // 字符串 <div :class="[classA, {classB: isClassB, classC: isClassC}]"></div>查看全部
-
模板指令--事件绑定：v-on查看全部
-
模板指令--渲染循环列表查看全部
-
v-if:不满足条件则不渲染； v-show：不满足条件，渲染代码，但是用display:none隐藏查看全部
-
v-html 渲染结构 v-text 渲染字符串 v-if 是否显示节点 v-show 显示节点 但是通过display实现 v-on 绑定事件和事件函数 v-for 数据平铺展示查看全部
-
Vue.js组件的重要选项--watch监听查看全部
-
data: 代表vue对象的数据 methods: 代表vue对象的方法 watch: 设置对象监听的方法 数据渲染：v-text、v-html、{{}} html和vue对象的粘合剂 模板指令 v-if v-show 控制显示隐藏 v-if直接不显示，v-show通过css的display:none来隐藏 渲染循环列表 v-for 事件绑定 v-on methods里的方法 属性绑定 v-bind查看全部
-
Vue.js组件的重要选项--data vue.js的重要选项：data (model层，对象的数据)，methods（代表vue对象的方法），watch监听设置监听的方法（）； 模板指令 - html和vue对象的粘合剂： 数据渲染 {{}}（数据双向绑定）、 v-text（格式处理了html） 、v-html（保存html结构） 控制模块的隐藏： v-if（直接不渲染dom元素）、v-show（通过css的display:none来隐藏）、 渲染循环列表: v-for 事件绑定: v-on（事件绑定与methods有关） 属性绑定： v-bind查看全部
举报
0/150
提交
取消