Vue.js is corrupting data when setting an array

Question

So I'm getting json response from my controller, which looks simply like:

return Plan::find($request->id)->toJson();

And when I'm setting the received data into the vue array, some data get corrupted, dates are being changed randomly (for exmaple, start date and end date become the same, but the network response is correct).

I found out that the problem is with vue.js that I'm using to control data. for now, the vue method that gets data looks as follows:

updatePlan: function(id) {
    var json;
    $.getJSON('{{action("Controller@getJSON")}}',{id}).success(function(data) {
    {plan: id}).success(function(data) {
        json=data;
        animatedOpenModal('edit-button','editPlanModal');                       
    });
    setTimeout(function(){
        console.log(json);
        //vm.setPlan(json);
    },100);
},

and the commented method is

setPlan: function(json) {
    vm.$set('current_edit_plan', json);
    console.log(vm.current_edit_plan);                  
},

and for now console.log(json) shows correct data, but if I remove // - everything will fall apart: dates will become incorrect in both console logs and in array itself.

What is this and how could it be solved? I would highly appreciate any possible help!

crabbly · Accepted Answer · 2016-05-25 04:26:36Z

1

Try this:

updatePlan: function(id) {
    var self = this;
    var json;
    $.getJSON('{{action("Controller@getJSON")}}',{id}).success(function(data) {
    {plan: id}).success(function(data) {
        json = data;
        animatedOpenModal('edit-button','editPlanModal');                       
    });
    setTimeout(function(){
        console.log(json);
        self.setPlan(json);
    },100);
},

Then for your setPlan method:

setPlan: function(json) {
    this.current_edit_plan = json;
    console.log(this.current_edit_plan);                  
},

answered May 25, 2016 at 4:26

crabbly

5,2261 gold badge26 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Vue.js is corrupting data when setting an array

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related