console
new Vue({
el: '#app',
data: function() {
return {
dialogVisible: false,
input:''
}
},
directives:{
focus:{
inserted: function (el) {
let dom = el.getElementsByClassName('el-input__inner')[0];
dom.focus();
}
}
}
})
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>
<div id="app">
<el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button>
<el-dialog
title="搜索框"
:visible.sync="dialogVisible"
width="30%">
<el-input v-if="dialogVisible" v-model="input" placeholder="请输入内容" v-focus></el-input>
</el-dialog>
</div>
</body>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
</html>