Comment ajouter dynamiquement un attribut dans VueJs

Question

J'utilise vuejs et je veux savoir comment contrôler les entrées (ajouter un attribut désactivé si nécessaire). Existe-t-il un moyen d'ajouter dynamiquement un attribut dans vuejs? Sous mon composant Textfield :

     <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>
 

Utilisation :

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

Answer 1

Vous pouvez le lier à une variable en utilisant v-bind:disabled="foo" ou :disabled="foo" pour faire court:

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

Ensuite, dans Vue, vous pouvez simplement définir this.myVar = true et cela désactivera l'entrée.

Modifier: ajoutez ceci à votre modèle:

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

Answer 2

base une condition, nous pouvons définir ou modifier les attributs en vue

Veuillez vous référer au document officiel pour le même https://vuejs.org/v2/guide/syntax.html#Attributes