如何获取MaterialTable中的id？

Question

我正在使用 "material-table": "1.53.0"，带有 editable 和 onRowUpdate 选项，我想更新 table 中的数据。我正在使用 axios 调用 put 方法，我可以很好地看到选项卡数据但是在修改任何字段并单击保存时

我看到以下错误：

xhr.js:166 PUT http://localhost:xxxx/api/User/edit/?IdUser=1 404 (Not Found)

我意识到无论我想更新哪一行，它总是告诉我我正在为 id 调用 1 而 IdUser 没有被发送，但是我做的是正确的

如何获取该行的idUser？

import React, { useState, useEffect } from 'react';
import MaterialTable from 'material-table';
import  axios  from 'axios';

export default function UserTable() {

const url='/api/Users';

const [user, setUser]= useState({DataUser:[]});


 useEffect(()=>{
    const getUser=async()=>{
            const response =await axios.get(url);
            setUser(response.data);
    }
    getUser();
},[]);

  return (
    <MaterialTable
    title="Users"
    columns={[
      {title: 'IdUser',field: 'IdUser', type: 'numeric', hidden:'false'},
      {title: 'name',field: 'name'},
      { title: 'lastname', field: 'lastname' },
      { title: 'age', field: 'age', type: 'numeric' },
    ]}
    data={user.DataUser}
    options={{
      filtering: true
    }}
    editable={{
      onRowUpdate: (newData, oldData) =>
      new Promise(resolve => {
          setTimeout(() => {
          resolve();
          const data=[...user.DataUser];
          data[data.indexOf(oldData)] = newData;
          axios.put('api/User/edit/', newData,{
                  params: {
                    id:user.DataUser[0].IdUser
                  }
              })
              .then(res => console.log(res.DataUser));
              setUser({...user,data});
      }, 600);
  }),
  }}
  />
);
}

Answer 1

不要使用 user.DataUser[0].IdUser 传递第一个用户 ID，您应该访问回调中作为 newData.

传递的用户的 ID

所以更改 axios 调用应该可以解决问题：

editable={{
  onRowUpdate: (newData, oldData) =>
  new Promise(resolve => {
      setTimeout(() => {
      resolve();
      const data=[...user.DataUser];
      data[data.indexOf(oldData)] = newData;
      axios.put('api/User/edit/', newData,{
              params: {
                id: newData.IdUser
              }
          })
          .then(res => console.log(res.DataUser));
          setUser({...user,data});
  }, 600);

如何获取MaterialTable中的id？

How to get the id in Material Table?

reactjs

material-table