Element nicht deaktiviert

Question

Ich habe dieses Verhalten zuvor erfolgreich implementiert, aber aus irgendeinem Grund funktioniert es nicht. Ich bin ziemlich neu in Vue.js und ich könnte etwas verpassen.

Ich habe zwei Radio-Buttons als solche:

<div class="radio"> 
    <label> 
     <input type="radio" name="loginRadio" id="frmLoginRadio" value="true" v-model="loginRadio" checked> 
     No, I am new to this site 
    </label> 
</div> 
<div class="radio"> 
    <label> 
     <input type="radio" name="loginRadio" id="frmRegisterRadio" value="false" v-model="loginRadio"> 
     Yes, my password is: 
    </label> 
</div> 

Beide haben eine V-Modell von loginRadio, die zunächst auf false gesetzt ist. Wenn der zweite Radioknopf angeklickt wird, sollte der deaktivierte Eingabeknopf darunter wieder aktiviert werden.

<input type="password" class="form-control" name="password" :disabled="loginRadio"> 

jedoch aus irgendeinem Grund, das einzige, was geschieht, ist dies (wenn ich Chrome Debug verwendet)

<input type="password" class="form-control" name="password" disabled="false"> 

und das Element deaktiviert bleibt. Was mache ich falsch?

Answer 1

Sie haben v-bind: nicht für das Attribut value Tasten der Eingangs

Daher verwenden loginRadio keine Boolesche Werte enthalten true oder false (je nach Wahl), aber Strings: "true" und "false"

es sollte genug sein, um richtig zu dem Wertattribut auf beiden Eingabetaste zu binden:

:value="true" 
:value="false"