<input type="text" @blur="focusState = false" v-focus="focusState"> *这里只能使用v-show,不能使用v-if *
<div @click="focusclick">按钮</div>
new Vue({
el: '#app',
data: {
message: 'hello!',
focusState: false
},
methods: {
focusclick () {
this.focusState = true
}
},
directives: {
focus: {
//根据focusState的状态改变是否聚焦focus
update: function (el, value) { //第二个参数传进来的是个json
if (value) {
el.focus()
}
}
}
}
})
html部分 js部分
使用vue的component组件实现动态点击按钮功能：
在原有项目基础上实现： enter键提交输入框内容 点击添加键后聚焦输入框 实现删除任务 实现任务状态切换 实现任...
vue-router用于实现页面的跳转，例如点击Home按钮，进入Home页面，点击About按钮，进入About...
问题描述： vue混合app开发中点击input输入框时，无法聚焦弹出键盘，有时需要多次点击才能弹出键盘，触发不灵...
功能描述： 1.输入框中输入内容时删除按钮出现 2.点击清除按钮清空输入框中的内容 3.点击页面中除了输入框和按钮...
实现思路：1、放置一个输入框，隐藏其文字和位置，同时设置支付输入框（表格）样式2、当点击输入框时设置输入框为聚焦状...
安装vue-resource 打开main.js配置vue-resource 点击按钮实现POST数据 Get获取...
只要你在打开这个页面后还没点击过任何内容，这个输入框就应当还是处于聚焦状态。现在让我们用指令来实现这个功能： //...
在home.vue里面写一个button按钮点击按钮 实现从首页跳转到about的界面 这里需要从vue-rou...
本文标题：用vue实现点击按钮输入框聚焦
本文链接：https://www.haomeiwen.com/subject/sicjixtx.html
网友评论