Quiero asignar una constante en una matriz a una variable y después de cambiar esta variable, la constante se actualiza con el nuevo valor de la variable.
Pero no puedo entender lo que debo calcular o ver.
Su ejemplo lo que quiero
PáginaA.vue
<div id="page-a"> <div class="card" v-for="door in doors" :key="door.id"> <div class="modelName">{{door.model}}</div> </div> </div> <script> export default { data() { return { firstDoorModel:"018", secondDoorModel:"015", doors: [ {model:firstDoorModel, id:"1"}, {model:secondDoorModel, id:"2"}, {model:firstDoorModel id:"3"}] } }, methods: { changeModel(){ this.firstDoorModel="012" this.secondDoorModel="010" } }Si te entendí correctamente, prueba de la siguiente manera:
new Vue({ el: "#page-a", data() { return{ doors: [{model: "", id: "1"}, {model: "", id: "2"}] } }, methods: { changeModel(arr){ for (let i = 0; i < this.doors.length; i++) { this.doors[i].model = arr[i] } } }, mounted() { this.changeModel(["018", "015"]) } }) <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="page-a"> <div class="card" v-for="door in doors" :key="door.id" > <div class="modelName">{{ door.model }}</div> </div> <button @click="changeModel(['012', '010'])">Change</button> </div>Demostración de trabajo:
const app = new Vue({ el: '#app', data() { return { doors: [{ model: '018', id: '1' }, { model: '015', id: '2' }] } }, methods: { changeModel(inputModelArr) { if (inputModelArr.length !== this.doors.length) { return; } this.doors.forEach((door, index) => { door.model = inputModelArr[index] }); } } }) <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="app"> <div v-for="door in doors" :key="door.id"> {{ door.model }} </div><br> <button v-on:click="changeModel(['10', '20'])">Change Book Model</button> </div>