vue实例
jq选择元素，得到一个jq实例就是对象，封装了jq的操作
const vm = new Vue(options)
这就是构造vue的实例，实例会根据选项得出一个对象，叫vm
封装了n+0 +1操作，事件绑定数据读写dom更新，没有ajax，视图层，不包括网络全部由vm负责，只要调用api就行
js原型
任何一个对象.proto ===其构造函数.prototype
vm.proto === Vue.prototype
内存地址
vm封装了dom对象和所有操作
new Vue是个函数，对象，地址是202，除了函数的基本性质还有那些
每个函数都有prototype
Vue.proto ==??.prototype
A Object B,arrray C Function D 其他
选 c Function.prototype 大写
任何函数proto === Funcrtion.prototype
1。new Vue(options)初始化时候能写进什么东西
options是new Vue的参数 称选项 构造选项（构造函数的选项）
文档搜options.5大类属性： 数据 dom 生命周期钩子 资源 组合
image.png
propsData
方法method：面向对象 方法一定是依附与一个对象 obj.sayhi()方法 sayhi()函数
template给完整版用的和render（非完整版）二选一
生命周期
createElement('div')还没出现在页面，没有append
created ：append（‘#app’）mount（挂载）
updated： 更新n:0 =>1
destroyed:从页面中消亡
钩子：hooks 可以切入的点 created mount updated destroyed
函数fn： 数学概念
入门属性
el-挂载点
和$mount有替换关系 基本认为replace和append
data-内部数据
一个组件的data选项必须是一个函数
image.png
为了组件的复用，使得每份组件都可以有一份data的拷贝，防止不同组件修改数据时被互相覆盖
为什么用对象错的？
如果是对象，对象会在这个组件的所有实例中共享防止指向同一个内存地址
import Demo from './Demo.vue'
如果你的data是写在.vue文件中，里面的data必须是函数
这个demo实际上是个对象
const object = Demo
vue会自动把对象传个new.vue
render:h =>h(x,[h(Demo),h(Demo)])//new Vue(Demo)
出现问题，第二次把demo对象传给了newVue,同一个data传给俩个组件，如果修改其中一个，另一个也变化
结论 ：import一个.vue组件得到的demo,data不能写成对象
函数的画，会先调用一下Demo.data()得到demo真正的data
Demo._data = Demo.data()第二次调用时候还会执行这句话，好处是第一次执行data函数得到全新对象，第二次执行还是全新对象
method
作为事件处理函数或者普通函数，可以代替filter
image.png
add一定要写在method里
image.png
第二中写法
image.png
this.array == data.array,
每次渲染都调用一次
components
Vue实例 Vue对象
创建vue组件
引用
第一种组件 import vue文件
import Demo from './Demo.vue'
const vm = new Vue({
components:{
Frank :Demo
}
})
template:`
<Frank/>//写的frank，对应demo组件，demo.vue里面只有demo这个字，效果就是在hr水平线上显示红色demo
`
第二个组件 声明一个全局
Vue.component(id:'Demo2', definition:{
template:'
<div>demo2</div>
'
}
const vm = new Vue({
template:'
<Demo2/>
'
})
第三种写法 前两种结合
cosnt vm = new Vue({
components:{
Frank ：{
data(){
return {n:0}
},
template:'
<div>Frank's n:{{n}}<./div>
'
}
}
})
可以把复杂组件放到Vue.component函数的第二个参数，接受的东西和new Vue一模一样。可以认为component就是给一个实例取了一个名字。如果直接newVue(const vm = new Vue({})那就叫做实例
用vue.component或者.vue文件那就叫组件
四个钩子
created
网友评论