我正在创建一个向导登录表单,首先输入手机号码,然后输入密码。
这里我试图集中使用
this.$$.passwordInput.focus()
但是如果出现以下错误
Uncaught TypeError: Cannot read property 'focus' of undefined
完整的代码如下
index.html
<div id="login">
<div v-if="flow.mobile">
<form v-on="submit: checkmobile">
<p>
Mobile Number<br>
<input type="text" v-model="mobile_number" v-el="mobileNumber">
</p>
</form>
</div>
<div v-if="flow.password">
<form v-on="submit: checkpassword">
<p>
Password<br>
<input type="password" v-model="password" v-el="passwordInput">
</p>
</form>
</div>
script.js
var demo = new Vue({
el: '#login',
data: {
flow: {
mobile: true,
password: false
}
},
methods: {
checkmobile: function(e) {
e.preventDefault();
this.flow.mobile = false;
this.flow.password = true;
this.$$.passwordInput.focus();
},
checkpassword: function(e) {
e.preventDefault();
}
}
});
如果您使用的是Vue.js 2.0,则应执行以下操作:
因此,您可以使用$ refs对象访问此输入:
希望对您有所帮助。