vue input，el-input自动获取焦点

解决方法：通过自定义指令来实现

项目实际应用

• mixin文件夹下创建dialogFocus.js文件写入自定义指令

export default {
  directives: {
    // 使用v-focus时对话框必须用v-if设置显示隐藏
    "focus": {
      inserted: function (el) {
        el.focus()
      }
    },
    "fo":{
      inserted (el, binding, vnode) {
          el.querySelector('input').focus()
      }
    }
  },
}

• 使用<input>的对话框用v-show设置显示隐藏时,自动获取焦点无效

<div v-if="dialogVisible">
	<div>对话框标题<span>关闭</span></div>
	<div class="dialog_body">
		名称：<input v-focus type="text" v-model="name" />
		金额：<input type="number" step="1" v-model="Amount"/>
		<el-button>保存</el-button>
	</div>   
</div>

<el-dialog 
	title="对话框标题" 
	:visible.sync="dialogVisible" 
    	:close-on-click-modal="false"
>
	名称：<el-input v-fo type="text" v-model="name" />
	金额：<input type="number" step="1" v-model="Amount"/>
    <el-button>保存</el-button>
</el-dialog>
<script>
import dialogFocus from '@/mixin/dialogFocus';
export default {
	mixins: [dialogFocus],
	data() {
		return {}
	}
}
</script>