记录vue认识过程中1.0到2.0不同
- v-el v-ref >> ref
2.0中v-el和v-ref被废除,ref属性代替
ref is used to register a reference to an element or a child component.The reference will be registered under the parent component’s $refs object. If used on a plain DOM element, the reference will be that element; if used on a child component, the reference will be component instance:
<!-- vm.$refs.p will be the DOM node -->
<p ref="p">hello</p>
<!-- vm.$refs.child will be the child comp instance -->
<child-comp ref="child"></child-comp>
this.$refs.p
this.$refs.child
- 2.0中去掉了events实例属性和$dispatch,$broadcast事件绑定
- 1.0 组件通信方式
子组件
父组件this.$dispatch('eventName', 'hello')
event:{ 'eventName':function(msg) { console.log(msg) } }
- 2.0中可以通过一个空vue对象实现一个事件处理器
main.vue
子组件new Vue({ el: '#main', data () { return { eventsHub: new Vue() } }, router: router, render: h => h(App) })
父组件this.$root.eventsHub.$emit('eventName','hello')
https://vuejs.org/v2/guide/migration.html#dispatch-and-broadcast-replacedcreated () { this.$root.eventsHub.$on('eventName',(msg) => { console.log(msg) }) }
- 1.0 组件通信方式