Question

我正在尝试使用以下特征设置对象的状态：

interface GridValue {
    control: string;
    rowIndex: number;
    cellIndex: number;
}

我的组件状态包含以下内容：

interface ComponentState {
    results: InChartModel[];
    loading: boolean;
    control: string;
    modalValue: GridValue[];
}

但是当我尝试使用以下代码设置状态时，它不起作用（属性“modalValue”的类型不兼容）：

handleClick(e: any) {
    const rindex: number = e.currentTarget.rowIndex;
    const cindex: number = e.target.cellIndex;
    const grid: any = e.currentTarget.parentNode.parentNode;
    const ctrl: string = grid.rows[rindex].cells[0].innerText;
    const metric: string = grid.rows[rindex].cells[1].innerText;
    this.setState({
        modalValue: {
            "control": ctrl,
            "rowIndex": rindex,
            "cellIndex": cindex
        }
    })
    this.props.getInptModal(ctrlType, metric);
}

这是如何正确地做到这一点的粗略想法？我已经能够用单个变量设置状态，但我正在努力用一个对象更新它。

Answer 1

您将modalValue描述为数组，但您将其设置为对象。将其类型更改为GridValue或使用setState上的数组：

this.setState({
  modalValue: [{
    control: ctrl,
    rowIndex: rindex,
    cellIndex: cindex
  }]
})

Answer 2

modalValue期待GridValue的数组，而不只是GridValue。您可以传入一组GridValue个对象，也可以将ComponentState的{{1}}设置为modalValue：

GridValue

具有多个项的对象的SetState

2 个答案: