- 首先用js的new关键字实例化一个vue
- el: vue组件或对象装载在页面的位置，可通过id或class或标签名
- template: 装载的内容。HTML代码/包含指令或者其他组件的HTML片段，template将是我们使用的模板
- data: 数据通过data引入到组件中
在组件中的data要以函数的形式返回数据，当不同的界面用了同一个组件时，
才不会因为为一个组件的值发生改变而改变其他页面的内容。
data () {
return {
......
}
}
- computed 计算属性，用于简单的运算，会保留缓存，当相关依赖没有发生改变时多次访问computed中的函数时，立即返回之前的计算结果，不会再次调用函数获得数据
- methods 方法/函数 没有缓存，每访问一次调用一次函数
-
watch 监听vue的变量，每当变量被改动的时候都去执行特定的操作。
<input type="text" v-model="myVal">
export default {
components: {
componentA: componentA
},
data () {
return {
myVal: ''
}
}
watch: {
myVal: function (val, oldVal) {
console.log(val, oldVal)
}
}
}
在文本框中随意输入123abd的过程中，控制台输出了文本框中的当前值和修改前的值。
- props 传递数据，让子组件使用父组件的数据。
接受两种类型的值。
①数组props: ['first' , 'sceond',...]
②对象
props: {
'number-to-do' : Number, //在html中传过来的都是字符串，所以这里可能会报错
'second': [Number, String, Object] //接受的类型，可为多个。
}
