在react js中从外部物料表单击按钮时在物料表中添加行

Question

如何在材料表外部点击按钮时调用材料表的增行功能

Add new row in the material table

Answer 1

导入import { forwardRef } from "react";

调用const addActionRef = React.useRef();

在你想要你的按钮的地方包含这段代码。我在这里使用material ui按钮

<Button
  color="primary"
  variant="contained"
  onClick={() => addActionRef.current.click()}  //The line you need 
>
  Add new item
</Button>

并覆盖材料表中的操作

​

components = {
  {
    Action: props => {
      //If isn't the add action
      if (typeof props.action === typeof Function || props.action.tooltip !== 'Add') {
        return <MTableAction { ...props
        }
        />
      } else {
        return <div ref = {
          addActionRef
        }
        onClick = {
          props.action.onClick
        }
        />;
      }
    }
  }
}

​

如果你有任何问题，请提出来。我在这里使用了react js和material ui。

https://github.com/mbrn/material-table/issues/2133

此链接可能对您有帮助...这就是我得到答案的地方