Cách thêm thuộc tính động vào VueJs

Question

Tôi đang sử dụng vuej và tôi muốn biết cách kiểm soát đầu vào (thêm thuộc tính bị vô hiệu hóa khi cần thiết). Có cách nào để thêm thuộc tính động trong vuejs? Dưới phần trường văn bản của tôi:

<template> 
    <input type="text" placeholder="{{ placeholder }}" v-model="value"> 
    </template> 
    <script> 
    export default { 
     props: { 
     disabled: {type: Boolean, default: false}, 
     placeholder: {type: String, default: ""}, 
     value: {twoWay: true, default: ""} 
     } 
    } 
    </script> 

Cách sử dụng:

<textfield placeholder="Name" value.sync="el.name" :disabled="true"></textfield> 

Answer 1

Bạn có thể gắn nó vào một biến sử dụng v-bind:disabled="foo" hoặc :disabled="foo" gọi tắt là:

<textfield label="Name" value.sync="el.name" :disabled="myVar"> 

Sau đó, trong Vue bạn chỉ có thể đặt this.myVar = true và nó sẽ vô hiệu hóa đầu vào.

Edit: thêm video này vào template của bạn:

<template> 
    <input type="text" :disabled="disabled" placeholder="{{ placeholder }}" v-model="value"> 
</template>