时间：2023-01-11 10:46:29 | 栏目：vue | 点击：次
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>