目录input框的禁用和可输入关于输入框的一些操作input框的禁用和可输入 input是我们经常使用的文本输入框,在Vue中我们可以用v-model来绑定输入框的值,但是有时我们拿
input是我们经常使用的文本输入框,在Vue中我们可以用v-model来绑定输入框的值,但是有时我们拿到一个值并通过v-model绑定到一个input框里,但是我们只想要显示这个值,不能修改,然后在某些特定的情况下在去改变这个值,这个时候就牵涉到文本框的禁用了
<input
type="text"//绑定的值
v-model="Copy.possWord1"
:readonly="read ? false : 'readonly'"
/>
当read=0时文本框不可用,当read=1时文本框可用
<template>
<div class="orderinfo">
<input type="text" v-model="text" @blur="blur()">
</div>
</template>
<script>
export default {
name: "Orderinfo",
data() {
return {
text:''
};
},
mounted() {},
watch: {
// 监听输入框输入
text: function(val) {
if (val.length > 0) {
console.log('显示删除')
} else {
console.log('不显示删除')
}
}
},
methods: {
//失去焦点
blur(){
console.log(this.text)
}
}
};
</script>
<style scoped lang="sCSS">
</style>
以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。
--结束END--
本文标题: vue中input框的禁用和可输入问题
本文链接: https://www.lsjlt.com/news/147085.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-01-12
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0