Question

如何从可编辑的物料表中同时获取查询列的文本和值？查找仅获取所选项目的值。例如；

{ "0":"Istanbul", "2":"Ankara", "3":"Izmir" }

如果在查询中选择“伊斯坦布尔”，那么我将获得0值。但是我需要0和Istanbul。

这是添加新行时的行值。

[{
    "txtIsinAdi":"İş 1",
    "lstIsinSinifi":"0"
},
{
    "txtIsinAdi":"İş 2",
    "lstIsinSinifi":"1"
}]

这是我在行中添加的代码：

               onRowAdd: newData =>
                new Promise((resolve, reject) => {
                    if(this.props.datafield.IsReadOnly === false)
                    {
                        setTimeout(() => {
                        {
                            const data = this.state.data;
                            data.push(newData);
                            this.setState({ data }, () => resolve());
                        }
                        resolve()
                        }, 1000)
                    }
                    else
                    {
                        this.messageHelper.showWarningMessage("Bu tabloya kayıt ekleme yetkiniz yok.");
                        reject();
                    }
                  })
            }}

Answer 1

您可以像这样简单地使查找对象成为全局对象：

const lookup = { "0":"Istanbul", "2":"Ankara", "3":"Izmir" }
class Table { ....}

并在列中使用它

columns={columns={[
      { title: 'Name', field: 'name' },
      { title: 'Surname', field: 'surname' },
      { title: 'Birth Year', field: 'birthYear', type: 'numeric' },
      {
        title: 'Birth Place',
        field: 'birthCity',
        lookup: lookup,
      },
    ]}}

并在您的回调中引用它：

 onRowAdd: newData =>
            new Promise((resolve, reject) => {
                // The value (0)
                const value = newData.birthCity;
                // The city (Istanbul)
                const city = lookup[value];
                if(this.props.datafield.IsReadOnly === false)
                {
                    setTimeout(() => {
                    {
                        // You are mutating your data here because its the same object
                        const data = this.state.data;
                        data.push(newData);
                        this.setState({ data }, () => resolve());
                    }
                    resolve()
                    }, 1000)
                }
                else
                {
                    this.messageHelper.showWarningMessage("Bu tabloya kayıt ekleme yetkiniz yok.");
                    reject();
                }
              })
        }}

此外，您正在对onRowAdd回调中的数据对象进行突变。 setState调用中的状态数据也可能有所不同，因为它们已被批处理。像这样设置数据：

this.setState(prevState => ({ data: [...prevState.data, newData] }), () => resolve());

这将确保数据已经是最新的并且不会被突变。

如何在React物料表上同时获取文本和查找列的值？

1 个答案: