Как обновить выдачу v-for во Vue?

Question

[dicem]

Делаю редактор квадратных карт на основе обычного массива.
Запилил следующее, на верхней панели выбираете тип блока который будет размещаться и кликаете по карте в центре, однако после клика выдача массива при помощи v-for не обновляется, хотя в консоли видно, что массив обновился.

Как это фиксить? Прошу помочь.

Comments

[Roman K]

:key у всех циклов где?

[dicem]

Roman Kitaev, добавил :key

<div class="row"
	v-for="(row, rI) in terain"
	:key="rI">
	<div
		v-for="(block, bI) in row"
		:key="[rI, bI]"
		:class="['block', changeBlock(block)]"
		@click="editBlock([rI, bI])"
	></div>
</div>

Результата не дало

Answer 1

[0xD34F]

Документацию всё-таки следует читать:

Vue cannot detect the following changes to an array <...> When you directly set an item with the index

Соответственно, вместо

this.terain[x][y] = Number(this.cursorBlock)

пусть будет

this.$set(this.terain[x], y, +this.cursorBlock);

// или

this.terain[x].splice(y, 1, this.cursorBlock | 0);

Comments

[dicem]

господи, хлопаю стоя, не раз уже меня выручаешь, спасибо большое!