如何更新@tracked 数组中对象的值，以便它可以在 ember js 中反映屏幕上的变化

Question

我有一个名为 updateData 的函数，每当有人点击一个单元格时，我想更新一个名为 state 的数组中的单元格，它有 3 个对象，我想更新第一个对象的键。我尝试了很多方法，但其中 none 似乎有效，如有任何帮助，我们将不胜感激。

import Service from '@ember/service';
import { tracked } from '@glimmer/tracking';
import { action } from "@ember/object";



export default class TictactoeDataService extends Service {

    @tracked state = [{ "one": "1", "two": "", "three": "" }, { "one": "2", "two": "", "three": "" }, { "one": "3", "two": "", "three": "" }]
    get all() {
        return this.state
    }
    @action
    updateData(val) {
        this.state[0].two=val; // not updating 
        this.state=this.state // not working
    }
}

Answer 1

我会这样做：

const state = this.state;
state[0].two = val;
this.state = [...state]

我认为 this.state=this.state 可能会保留相同的引用，因此不会更新自动跟踪，而展开数组肯定会创建一个新数组。

如何更新@tracked 数组中对象的值，以便它可以在 ember js 中反映屏幕上的变化

How to update an objects' value in a @tracked array so that it could reflect the changes on screen in ember js

javascript

ember.js