Я все еще изучаю основы Vue.У меня есть разные элементы в одном компоненте, которые должны быть назначены во втором компоненте.Когда я использую console.log, массив отображается правильно, но когда я хочу показать массив динамически в шаблоне, он все равно является значением по умолчанию.Что я делаю не так?
Компонент один:
<template>
<div>
{{nr}}
{{containertyp}}
<button @click="click(0)"></button>
</div>
</template>
У меня есть еще много кнопок с различными параметрами, просто чтобы сделать их здесь короче.
export default: {
data: function {
return {
nr: [],
containertyp: [],
}
}
methods: {
click(number) {
for (var i = 0; i < 27; i++) {
this.nr[i] = false;
if (number == i) {
this.nr[i] = true;
}
};
EventBus.$emit('containerclicked');
}
},
created: function() {
let i;
//default
for (i = 0; i < 27; i++) {
this.nr[i] = false;
}
for (var index = 0; index < 27; index++) {
this.containertyp[index] = 'bs';
}
},
mounted() {
const self = this
EventBus.$on('containertypchosen', function (containertyp) {
for (let j = 0; j < 27; j++) {
if (self.nr[j] == true) {
self.containertyp[j] = containertyp
}
}
})
Компонентдва:
<template>
<div>
<button :disabled = "disabled == true" v-on:click="chosetype('bs')" "> bs </button> <br />
</div>
</template>
export default: {
data: function() {
return {
disabled: true
}
}
mounted () {
const self = this
EventBus.$on('containerclicked', function (){
self.disabled = false
})
},
methods: {
chosetype: function (containertyp) {
this.containertyp = containertyp
EventBus.$emit('containertypchosen', containertyp)
}
}
}