Comment rendre une entrée en lecture seule basée sur une valeur particulière dans Vue?

Question

Comment faire en sorte qu'un champ de saisie soit lu uniquement à partir des données Vue?

Par exemple:

<select class="form-control" 
        id="selectCategory" 
        :disabled="cat_id >= 
            1" 
        name="cat_id">

Je veux que le champ soit en lecture seule mais pas désactivé. Comment puis-je atteindre cet objectif?

Answer 1

Veuillez noter que, selon les spécifications HTML, la balise select en HTML n'a pas d'attribut en lecture seule. 

Cependant, dans le cas général, je choisirais quelque chose comme ceci:

<input class="form-control" id="selectCategory" :readonly="(cat_id >= 1) ? true : false">

Fondamentalement, la documentation indique que si une valeur d'attribut est évaluée à false, l'attribut est omis. Voir ici pour plus de détails.

Answer 2

Vous pouvez faire quelque chose comme ça: 

<input v-bind:readonly="isReadOnly">