vue.js
vue.js 的构造
- new Vue({})
- new new MyComponent()
属性与方法
vue会代理其data对象里所有的属性
例如
data.a=vn.a
vm.$id \vm.$data等
生命周期函数实例 (例如，实例需要配置数据观测(data observer)、编译模板、挂载实例到 DOM ，然后在数据变化时更新 DOM 。)
==钩子函数==
*created（创建后）
*mounted（载入后）
*updated（更新后）d（销毁后）
*estroyed（销毁后）
var vm = new Vue({
data: {
a: 1
},
created: function () {
// `this` 指向 vm 实例
console.log('a is: ' + this.a)
}
})插值
数据绑定最常见的形式就是使用 “Mustache” 语法（双大括号）的文本插值：
为了输出真正的 HTML ，你需要使用 v-html 指令：
<div v-html="mas"></div>v-bind
mustache 语法不能作用在 HTML 特性上所以用v-bind来给HTML属性
v-bind:title="" 等可以缩写为：title
v-bind:href="" 等可以缩写为：href
v-on 用于监听事件
v-on:click="" 缩写为@click=""
过滤器（过滤器可以用在两个地方：mustache 插值和 v-bind 表达式。）
过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符指示：
<body>
<div class="a1">{{mas|pps|pps1}}
</div>
<script>
var vm =new Vue({
el:'.a1',
data:{
mas:'qwt jnbfth'
},
filters:{
pps:function(val){
return val.toUpperCase()
},
pps1:function( val){
return val.split("").reverse().join("")
}
}
})
</script>
</body>计算属性
vs method 与vs watched 属性的区别
我们可以将同一函数定义为一个 method 而不是一个计算属性。对于最终的结果，两种方式确实是相同的。然而，不同的是计算属性是基于它们的依赖进行缓存的。计算属性只有在它的相关依赖发生改变时才会重新求值。这就意味着只要 message 还没有发生改变，多次访问 reversedMessage 计算属性会立即返回之前的计算结果，而不必再次执行函数。
computed: {
fullName: {
// getter
get: function () {
return this.firstName + ' ' + this.lastName
},
// setter
set: function (newValue) {
var names = newValue.split(' ')
this.firstName = names[0]
this.lastName = names[names.length - 1]
}
}
}
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。