The DOM is not updated after changing data VueJS — why?

There is a component that takes from a state the object of the campaign.
To created component based on the properties of the object, I create another property of that object:
this.campaign.status = this.campaign.schedule ? 'dates' : 'now'; // new property


In the template is dependent on the new property and changing its code (using the radio buttons):
<app-radio name="schedule"
 :value="campaign.status == 'now'"
 @input="campaign.status = 'now'"
></app-radio>
<app-radio name="schedule"
 :value="campaign.status == 'dates'"
 @input="campaign.status = 'dates'"
></app-radio>

<span>{{campaign.status}}</span>

The last line just to reduce the code - there is a bulky unit that will be shown depending on this status.

And problems that when you switch the radio buttons nothing happens on the page, but switching the radio buttons, it should change the text in the span, described at the end of the code.

If this is the same block of code, but with another property, works perfectly and the text changes. The difference is that this other property is initially there are in this object campaignand is not set to created.
I also noticed that the reaction to change the properties of status occurs after you change any other object properties campaign.

What am I missing at work? Why is this happening?
March 12th 20 at 08:41
1 answer
March 12th 20 at 08:43
Solution
If this is the same block of code, but with another property, works perfectly and the text changes. The difference is that this other property was originally in this campaign the object and not set to created.

Clear. You obviously think that documentation is not necessary to read. You are wrong. Read.

Find more questions by tags Vue.js