V-Modell Wert Update Problem, wenn übergeben Prop Wert von Eltern zu Kind

Question

Ich bin ein Objekt 'Element' von Eltern zu 'Kind' Komponente übergeben. Es funktioniert gut. Bitte beziehen Sie sich auf this.

Wenn Sie die Werte aus dem Dropdown-Menü ändern, wird die Benutzeroberfläche aktualisiert. Mein Problem ist, dass derselbe genaue Code in meiner Anwendung nicht funktioniert (lokal auf meinem Computer ausgeführt wird). Ich habe sogar versucht, {{item.type}} in HTML hinzuzufügen, aber es ändert sich nicht (haftet am ursprünglichen Wert). Eine Sache, die ich bemerkte, dass, wenn ich @change='onChange' setzte und den Wert in onChange Methode druckte und druckt aktualisierten Wert.

Wirklich nicht in der Lage, eine Lösung zu finden, um dies zu beheben. Jede Hilfe wäre großartig. Vielen Dank.

Answer 1

Das Problem besteht darin, dass Sie die Eigenschaft type zu Ihrem Modell hinzufügen, nachdem das Element bereits an Daten gebunden wurde, und Vue cannot detect changes zu Eigenschaften, die auf diese Weise hinzugefügt wurden.

Das Update ist, um sicherzustellen, gibt es eine type Eigenschaft auf item,

item: { 
    "direct_sale_price": "", 
    "is_auction": true, 
    "is_tender": false, 
    "type": null 
} 

oder richtig es $set mit hinzuzufügen.

created: function() { 
    if (this.item.is_auction) { 
    this.$set(this.item, 'type', 'auction') 
    } else if (this.item.direct_sale_price) { 
    this.$set(this.item, 'type', 'direct-sale') 
    } else if (this.item.is_tender) { 
    this.$set(this.item, 'type', 'tender') 
    } else { 
    this.$set(this.item, 'type', 'plain') 
    } 
}