vue --- > ref属性获取dom元素和子组件的方法

说明:

// 假设login的组件定义如下:
Vue.component('login', {
    template:'<h1>登录</h1>',
    data(){
        return {
            msg:'son msg',
        }
    },
    methods(){
        show(){
            console.log('调用子组件的方法');
        }
    }
})
// 在父元素中使用
<div id="app">
    <login ref="myLogin"> </login>
</div>

// 使用ref ="myLogin" 相当于css选择器里面的id属性
// 打开网页后再控制台上打印 vm (vm = new Vue({...}))

// 可以看到,有一个myLogin 挂载到$refs上. 于是可以再父元素的方法中使用 this.$refs.myLogin 来使用子组件的数据和方法了!
methods(){
    getElement(){
        console.log(this.$refs.myLogin.msg);
        this.$refs.myLogin.show();
    }
}