Vue 截取字符串与input 自动获取焦点！

Vue input 框 删除输入内容 自动获取焦点

<template>
<input ref='id' v-model="msg"
id="searchMT" placeholder="输入汉字搜索..." >
<div @click="deleteci">删除</div>
</template>

export default {
data() {
return {
msg:'',
}
},
methods: {
deleteci(){
let name= $('#searchMT').val()
let strs=name.replace(/(^s+)|bai(s+$)/g, "");//去除前后的du空格
var strng = strs.substr(0,strs.length-1)
//console.log(strng);
this.msg = strng;
this.changfouce();
},
//自动获取焦点
changfouce(){
this.$nextTick((x)=>{
//正确写法
this.$refs.id.focus();
})
}
},
created(){
//自动获取焦点
this.changfouce();
},
}

这是进入页面input自动获取焦点，手动点击删除input里面的内容，因为在删除的时候焦点会失去所以在删除的函数里面重新调用一下获取焦点的函数就可以实现手动点击删除而失去焦点！配合上vue的v-model来给内容框重新赋值。就可以实现实时改变内容。

最后

以上就是野性荔枝为你收集整理的Vue 截取字符串与input 自动获取焦点！的全部内容，希望文章能够帮你解决Vue 截取字符串与input 自动获取焦点！所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。