在Vue中處理input不可編輯可以通過設置input的readonly
屬性來實現,示例如下:
<template>
<div>
<input type="text" v-model="inputValue" :readonly="isReadOnly">
<button @click="toggleReadOnly">Toggle Readonly</button>
</div>
</template>
<script>
export default {
data() {
return {
inputValue: '',
isReadOnly: false
}
},
methods: {
toggleReadOnly() {
this.isReadOnly = !this.isReadOnly;
}
}
}
</script>
在上面的示例中,isReadOnly
表示input是否為只讀狀態,通過點擊按鈕Toggle Readonly
可以切換input的可編輯狀態。