MATERIAL-TABLE 的 LOOKUP 屬性不會改變 initialValue

Question

各位朋友下午好 打擾一下，我正在嘗試更新材料表庫中我的列 CARD_ID 的 LOOKUP 屬性，因為我必須從 API 中查詢這些數據，所以我創建了一個名為 setObj 的鈎子，我用它來更新該屬性的狀態，但它仍然沒有改變它的初始值，因此我的 LOOKUP 沒有改變值，有人知道為什么嗎？

 import React, { useEffect, useState } from 'react'; import MaterialTable from 'material-table'; import { Button } from '@material-ui/core'; import { useDispatch, useSelector } from 'react-redux'; import { showCards } from 'js/actions/cardAction'; export default function MaterialTableDemo(props) { const { concentrator } = props; const dispatch = useDispatch(); const cards = useSelector(state => state.cards.cards); const onSubmit = values => { //dispatch(postForm(values)); console.log('DATA: ', values); }; const [obj, setObj] = useState({}); console.log(obj); const [state, setState] = React.useState({ columns: [ { title: 'Fase', field: 'phase', type: 'numeric', editable: 'never' }, { title: 'Tarjeta', field: 'card_id', lookup: obj }, { title: 'Entrada', field: 'input' }, { title: 'Medicion', field: 'unit', lookup: { CORRIENTE: 'Corriente', VOLTAJE: 'Voltaje' } }, { title: 'Relacion', field: 'relation', lookup: { '50:1': '50:1', '100:1': '100:1', '200:1': '200:1', '500:1': '500:1', '1000:1': '1000:1', '50:5': '50:5', '100:5': '100:5', '200:5': '200:5', '500:5': '500:5', '1000:5': '1000:5' } }, { title: 'Offset', field: 'offset', type: 'numeric' }, { title: 'Ajuste', field: 'ajust', type: 'numeric' } ], data: [ { phase: 'A', card_id: '', input: '', unit: '', relation: '', offset: '', ajust: '' } ] }); useEffect(() => { dispatch(showCards(concentrator)); setObj( cards.reduce(function(acc, cur, i) { acc[cur.id] = cur.name; return acc; }, {}) ); }, []); return ( <div> <MaterialTable columns={state.columns} data={state.data} editable={{ onRowAdd: newData => new Promise(resolve => { setTimeout(() => { resolve(); const data = [...state.data]; data.push(newData); setState({ ...state, data }); }, 600); }), onRowUpdate: (newData, oldData) => new Promise(resolve => { setTimeout(() => { resolve(); const data = [...state.data]; data[data.indexOf(oldData)] = newData; setState({ ...state, data }); }, 600); }), onRowDelete: oldData => new Promise(resolve => { setTimeout(() => { resolve(); const data = [...state.data]; data.splice(data.indexOf(oldData), 1); setState({ ...state, data }); }, 600); }) }} options={{ pageSize: 10, pageSizeOptions: [5, 10, 20, 30, 50, 75, 100] }} options={{ search: false }} title=" " /> <Button color="secondary" onClick={() => onSubmit(state.data)} style={{ marginTop: '20px', width: '100%' }} variant="contained" > Guardar Puerto 1 </Button> </div> ); }

Answer 1

根據您提供的示例，您不需要使用查找功能。

 lookup: {
      '50:1': '50:1',
      '100:1': '100:1',
      '200:1': '200:1',
      '500:1': '500:1',
      '1000:1': '1000:1',
      '50:5': '50:5',
      '100:5': '100:5',
      '200:5': '200:5',
      '500:5': '500:5',
      '1000:5': '1000:5'
 }

您的 Id 與值相同，因此完全不需要查找。