Vue.Js Set all keys in data() obj with function from fetched api data

392 Views Asked by At

I have a product component in vue.js.

All the json in data() {} is fetched from an api

I'd like to be able to set each key automatically from the fetched json insteach of having

I'm trying to achieve

data() {
  return {
    id: "1",
    sku: "g500",
    brand: "gildan"
  }
}

Instead Of This

data() {
  return {
    product: {
      id: "1",
      sku: "g500",
      brand: "gildan"
    }
  }
}

The vue.js method I'm using to set my data looks simulare to this... (actually data object has many more keys)

setData(product) {
  this.id = product.id;
  this.brand = product.brand;
  this.sku = product.sku;
}

is there a way I can make a method where I dont have to list out each "this.[key]"

Reason why I'm trying to create a function for this is because I want to use it as a global function and I dont want it to break if anything changes as I configure the database.

Thank you!!!

0

There are 0 best solutions below