Cannot read properties of undefined (reading ‘focus‘)“

出现这个的原因是获取的元素没有出来 等同于undefined.foucus

以ref获取元素为例this.$refs.ipt.focus()

直接写该代码会报错

解决办法一：在外面加定时器

解决办法二：$nextTick

1.  
   <template>
2.  
   <div>
3.  
   <button v-if="isShow" @click="tabFn">按钮</button>
4.  
   <input ref="ipt" v-else type="text" />
5.  
   </div>
6.  
   </template>
7.  
    
8.  
   <script>
9.  
   export default {
10.  
    data() {
11.  
    return {
12.  
    isShow: true,
13.  
    };
14.  
    },
15.  
    methods:{
16.  
    tabFn(){
17.  
    this.isShow=false
18.  
    // 方法一
19.  
    // setTimeout(() => {
20.  
    // this.$refs.ipt.focus()
21.  
    // }, 500);
22.  
    // 方法二
23.  
    this.$nextTick(()=>{
24.  
    this.$refs.ipt.focus()
25.  
    })
26.  
    }
27.  
    }
28.  
    };
29.  
    </script>
30.  
     
31.  
    <style>
32.  
    </style>

这篇好文章是转载于：学新通技术网