快速上手vue必看——要点介绍

一、 Vue 数据双向绑定


//数据双向绑定:
 
Object.defineProperty(obj, 'name', {
 
Value: "",
 
Writable:"" ,
 
get() {
 
},
 
set(val) {
 
}
 
});

二、 Vue中虚拟DOM

虚拟DOM: 其实就是一个对象。

虚拟DOM2和虚拟DOM1进行比较,比较完成后(diff)DOCUMENT

三、Vue的指令

V-model V-text v-if v-show v-bind(? v-on(@) v-html

v-if v-show

四、 vue的methods

@click="xxxx"
 
methods: {
 
xxxx() {
 
this.xxxx
 
}

五、Vue的directives(自定义指令)

自定义指令: 一般有相同DOM操作的时候(v-focus)


1) 全局自定义
 
Vue.directive('focus', function(el, bindings) {
 
})
 
2)局部
 
directives: {
 
focus() {
 
}}

六、 Vue中的自定义filters(过滤器)


过滤器: 对数据再次处理,来达到你想要的数据。
 
Vue.filter('', function() {})
 
filters: {
 
my() {
 
}}

七、 Vue中的组件


组件就是一个对象
 
let top = {
 
template: 'html代码',
 
data() {
 
return {}
 
},
 
methods:{}
 
}
 
 
 
Vue.component()
 
components: {
 
top
 
}
}}

八、 组件通信

父传子 props 自定义属性

子传父 @event 自定义事件

兄弟 EventBus 事件车 $on $off $emit()

九、 Vue DOM操作

ref

this.$refs.refname

#

你可能感兴趣的:(Vue)