Добрый день, друзья, добрый день Извините, я пытаюсь обновить свойство LOOKUP моего столбца CARD_ID в библиотеке таблицы материалов, так как мне нужно обращаться к этим данным из API, я создал ловушку с именем setObj, которую я использую для обновления статус этого свойства, но он по-прежнему не меняет своего начального значения, поэтому мой ПРОСМОТР не меняет значений, кто-нибудь знает, почему?
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>
);
}