[Vuejs]-Cannot format or transform data before save, bound too tightly to the view

by

0👍

✅

The easiest way is to make a clone using Object.assign, like so:

let form = Object.assign({}, this.form);
form.age = 21;

Here’s the JSFiddle: https://jsfiddle.net/y51yuf05/

👤craig_h

0👍

Objects are passed by reference in javascript, which means:

let a = {
  "apple": 6
}

let b = a

then, b and a are pointing to the same location in the memory, it is essentially copying the address of the object in a to the variable b.

You need to therefore clone the object, there are many ways to do it like:

b = Object.assign({}, a)

MDN: Object.assign()

this would not be deeply cloned, which means if your object is nested then the nested objects would still be linked between the original and the copy.

for which I use: 

function isObject(obj) {
  return typeof obj === 'object' && !Array.isArray(obj)
}

function clone(obj) {
  let result = {}
  for (let key in obj) {
    if (isObject(obj[key])) {
      result[key] = clone(obj[key])
    } else {
      result[key] = obj[key]
    }   
  }
  return result
}

function logger () {
  console.log("p.a.b.c: ", p.a.b.c)
  console.log("q.a.b.c:", q.a.b.c)
  console.log("r.a.b.c:", r.a.b.c)
}

let p = {a: {b: {c: 5}}}
let q = clone(p)
let r = Object.assign({}, p)

logger()
p.a.b.c = 11
logger()
👤Amresh Venugopal

Leave a comment