vue获取input焦点

vue获取input焦点

有弹框的情况

<template>
 <div>
	<div>
      <el-button type="primary" plain :disabled="id?false:true" size="small" @click="buildBoard()">弹框</el-button>
    </div>
    <el-dialog title="选择模板" :visible.sync="dialogBoard" width="50%">
		<el-input v-model="name" ref="inputID" placeholder="请输入"></el-input>
	</el-dialog>
 </div>
</template>

<script>
data(){
	return {
	dialogBoard:false
	}
},
methods: {
	buildBoard:{
	//当dialogBoard【弹框为true的时候】，触发获取焦点事件
      this.dialogBoard = true;
      this.$nextTick(() => {
        this.$refs.inputID.focus()
      })
     }
   }
</script>

没有弹框的情况

<template>
  <div class="focusDemo">
    <input ref="inputName" type="text" v-model="username" />
  </div>
</template>

<script>
export default {
  data () {
    return {
      username: ''
    }
  },
  mounted () {
    this.$nextTick(() => {
      this.$refs.inputName.focus()
    })
  }
}
</script>