Vue 获取DOM元素 ，给DOM增加事件的特殊情况

Vue 获取DOM元素 ，给DOM增加事件的特殊情况

给标签绑定ref属性 使用this.$refs.xxx 获取原生的jsDOM对象
ref属性值不能重名

	Vue.component('subCom',{
        template:`
`
    })

    var App = {
        template:`
                

                    按钮1
                    
                
`,
        created() {
            console.log(this.$refs.btn);
        },
        mounted() {
            console.log(this.$refs.btn);
            // 如果给组件绑定ref属性，那么this.$refs.xxx获取的是当前的组件对象 
            console.log(this.$refs.abc);
        },
    };
    new Vue({
        el:"#app",
        data() {
            return {
                
            }
        },
        components:{
            App
        },
        template:``
    })

$nextTick()
在DOM更新循环结束之后执行回调函数，在修改数据之后使用此方法
在回调中获取到更新后的DOM

	var App = {
        data() {
            return {
                isShow:false,
            }
        },
        template:`

                        
                    
`,
        mounted() {
            this.isShow = true;
            this.$nextTick(()=>{
                // 数据更新之后表单获取焦点
                this.$refs.input.focus();
            })
        },
    };
    new Vue({
        el:"#app",
        components:{
            App
        },
        template:``
    })