Vue: V-model is not working for some fields and acting strange.

[murbanowicz]

Hi,
I haven't found any bug in my code, so I think it can be caused by VueJS by itself.

I have list of events.
When I click it, is is becoming eventInEdit.

<button type="button"
                        class="btn"
                        v-for="eventin list | filterBy day.id in 'day'"
                        v-bind:class="{ 'btn-success' : event.isSpecial, 'btn-danger' : isSuspended , 'btn-primary' : !event.isSpecial & !event.isSuspended}"
                        @click="edit(event)"
                >

Edit form is shown only when something is in edit: <div id="edit" v-if='eventInEdit'>
As requests could become quite huge, when fetching only list, I am giving only necessary columns: ['id','day','time','isSpecial','isSuspended']

When event is becoming eventInEdit I am retrieving all details:

edit: function ( event ) {
                var _self = this;
                // SET given event as in edit
                var eventToEdit = event;
                // GET event details
                Vue.http.get('api/eventes/details/'+event.id, function (details) {
                    Object.assign(eventToEdit, details);
                    console.log(eventToEdit);
                    _self.eventInEdit = eventToEdit;
                });

            }

Then, I have more details:

eventInEdit: Object
id: 36
day: 1
time: "7:00"
isSpecial: 1
isSuspended: 0
dateFrom: "2015-11-12"
dateTo: "0000-00-00"
suspendedDateFrom: "-0001-11-30 00:00:00"
suspendedDateTo: "-0001-11-30 00:00:00"

I have all fields and they are visible in form with values, but...

Inputs are all like that

<input  type="text"  v-model="eventInEdit.dateFrom" class="form-control">

When I enter the value and switch to next field or anywhere else - field is immediately gone back to initial value (as loaded from server, so in this case it will always go back to 0000-00-00 for dateTo. If field is empty - it's going back to empty.
Strange is also that it is saving entered value in the model (visible in vue devtools).
I have no idea what is going on and how to repair it as it is acting really strange...

What I've found , is that binding is not working. I just put {{ eventInEdit.dateFrom }} above the field and it is not reactive when I am changing.. any idea why ? Time is working ok. IsSpecial and isSuspended as well.

[yyx990803]

The problem is Object.assign returns the first object itself instead of a new one.

http://vuejs.org/guide/reactivity.html#Change-Detection-Caveats