缓存 ：<keep-alive> <transition>
<keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 <transition> 相似，<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在父组件链中。
当组件在 <keep-alive> 内被切换，它的 activated 和 deactivated 这两个生命周期钩子函数将会被对应执行。
渲染视图组件： router-view
<router-view> 组件是一个 functional 组件，渲染路径匹配到的视图组件。<router-view> 渲染的组件还可以内嵌自己的 <router-view>，根据嵌套路径，渲染嵌套组件。
因为它也是个组件，所以可以配合 <transition> 和 <keep-alive> 使用。如果两个结合一起用，要确保在内层使用 <keep-alive>：
<transition>
<keep-alive>
<router-view></router-view>
</keep-alive>
</transition>
组件： components
a链接：<router-link to="/about">About</router-link>
路径中重定向： redirect
{
path: '/',
redirect: '/goods'
}, {
path: '/goods',
component: goods
}
用$http时要引入 vue-resource
import vueResource from 'vue-resource'
vue.use（vueResource）
$refs用法：
一般来讲，获取DOM元素，需document.querySelector（".input1"）获取这个dom节点，然后在获取input1的值。
但是用ref绑定之后，我们就不需要在获取dom节点了，直接在上面的input上绑定input1，然后$refs里面调用就行。
例：<div ref = ' a '></div> var a = this.$refs.a
什么时候需要用的Vue.nextTick()
你在Vue生命周期的created()钩子函数进行的DOM操作一定要放在Vue.nextTick()的回调函数中。原因是什么呢，原因是在created()钩子函数执行的时候DOM 其实并未进行任何渲染，而此时进行DOM操作无异于徒劳，所以此处一定要将DOM操作的js代码放进Vue.nextTick()的回调函数中。与之对应的就是mounted钩子函数，因为该钩子函数执行时所有的DOM挂载和渲染都已完成，此时在该钩子函数中进行任何DOM操作都不会有问题 。
在数据变化后要执行的某个操作，而这个操作需要使用随数据改变而改变的DOM结构的时候，这个操作都应该放进Vue.nextTick()的回调函数中。
原因是，Vue是异步执行dom更新的，一旦观察到数据变化，Vue就会开启一个队列，然后把在同一个事件循环 (event loop) 当中观察到数据变化的 watcher 推送进这个队列。如果这个watcher被触发多次，只会被推送到队列一次。这种缓冲行为可以有效的去掉重复数据造成的不必要的计算和DOm操作。而在下一个事件循环时，Vue会清空队列，并进行必要的DOM更新。
当你设置 vm.someData = 'new value'，DOM 并不会马上更新，而是在异步队列被清除，也就是下一个事件循环开始时执行更新时才会进行必要的DOM更新。如果此时你想要根据更新的 DOM 状态去做某些事情，就会出现问题。。为了在数据变化之后等待 Vue 完成更新 DOM ，可以在数据变化之后立即使用 Vue.nextTick(callback) 。这样回调函数在 DOM 更新完成后就会调用。
this.$emit('add', event.target);子组件把数据传给 父组件
Vue.set( target, key, value )设置对象的属性。如果对象是响应式的，确保属性被创建后也是响应式的，同时触发视图更新。这个方法主要用于避开 Vue 不能检测属性被添加的限制。
props 中的数据是数组，默认值
props: {
selectFoods: {
type: Array,
default: function () {
return {
price: 10,
count: 1
}
}
}
}
1.jpg
在computed中的function 是根据数据变化 而执行的
在vue.js中 返回数据
return ` ￥${this.minPrice}元起送 `
这里用的是es6反引号
子组件中
this.$emit('add')
父组件中
<cartcontrol @add="addFood"></cartcontrol>
当子组件抛出this.$emit('add')这句话时，父组件就要调用addFood事件（理解： 相当于子组件的回调函数）
时间显示
yyyy-MM-dd hh:mm 这个月 一定要大写 不然就跟分钟冲突了
Math.abs(x) === x的绝对值
网友评论