10-ref|refs

• 总结ref与refs的用法有几点：
  • ref可以绑定同在一个实例上的任何自定义组件和标签。
  • 均可以通过$refs.xx 来访问data和调用其方法。
• html

    {{msg}}



    
    点我访问兄弟方法且每次+1。

• js

 // 这是公共组件
    Vue.component('unit-two', {
        template: '
我被点击{{num}}次点我+1
',
        data: function () {
            return {num: 1}
        },
        methods: {
            addNum: function () {
                this.num++
            }
        }
    });
    var app1=new Vue({
        el:"#app1",
        data:{
            msg:'信息'

        },
        methods:{
            clickBtn(){
                console.log(this.$refs.btn.innerHTML);
            }
        }
    });

    var app2=new Vue({
       el:"#app2",
       methods:{
           cBtn(){
               // 可以直接给子级赋值
               // this.$refs.chilrenUnit.num+=5;
               // 也可以去调用组件里面的方法
               this.$refs.chilrenUnit.addNum();
               console.log(this.$refs.chilrenUnit.num);
           }
       }
    });