在对象中添加 HTML 元素

Question

我正在使用这个数组状态在表格上呈现信息：

正如你们所看到的，我需要在表格的每一行上放置一个复制按钮，但我尝试将 HTML 直接插入到它自己的对象中，但它失败了：

如何在表格的每一行显示此复制按钮？
提前致谢。

Answer 1

这个：

renderCell: (ValueFormatterParams) => {
  <a href="#">Oi </a>; // you are missing return statement
}

应该是：

renderCell: (ValueFormatterParams) => {
  return (<a href="#">Oi </a>); 
}

或：

 renderCell: (ValueFormatterParams) => ( <a href="#">Oi </a>)

编辑：从行获取数据：

  copyHanle = (item) => {
    console.log(item);
  }
  
  //...
  render() {
   const columns = [
      //...
      renderCell: (ValueFormatterParams) => {
         const {row} = ValueFormatterParams;
         return (
            <CopyToClipboard
              text={row.name}
              onCopy={() => this.setState({ copied: true })}
             >
             <button>Copy</button>
          </CopyToClipboard>)
    }
   ]
   //...
  }

见：https://material-ui.com/components/data-grid/rendering/#render-cell