预期分配或函数调用，而是看到一个表达式反应路由器

Question

我在材料表中有一个按钮。我正在使用React Router将页面路由到不同的URL。该页面应该设置功能并调用物料表<MuiTable>，然后在物料表下方呈现一个按钮。由于MuiTable元素的可重用性，因此以这种方式进行设置。

export default function ListJobs(props) {

  const url = 'http://localhost:8000/api/Jobs/'
  const [data, loading] = DataLoader(url);
  const handleEdit = (e,rowData) => {
    <EditJob id={rowData.id} />
  }
  const handleDelete = (e,rowData) => {
    //edit operation
    <ListJobs />
    DataDelete(url, rowData.id)

  }
  const createButton = 
    <div style={{display: 'flex',  justifyContent:'center', alignItems:'center'}}>
    <Button 
        component={Link} to='/Job/Create'
        variant="contained"
        color="primary">
        Create New Job
      </Button>
    </div>

  return (
    <> {loading ? (
    <Grid
        container
        spacing={0}
        alignItems="center"
        justify="center"
        style={{ minHeight: '90vh' }}
      >
    <CircularProgress size="10vh" />
    </Grid>
    ) : (
      <MuiTable 
        model="Job" 
        data={data} 
        url={url} 
        handleEdit={handleEdit} 
        handleDelete={handleDelete} 
        createButton={createButton}
        />
    )}
    </>
    );
}

这当前在调用<EditJob...>和<ListJobs>的行上引发并显示错误“预期分配或函数调用，而是看到了表达式”。我知道这不是编写此脚本的正确方法，但我想将其更改为使用React路由器。我已经设置了路由器，但是不知道如何在这种情况下使用它们。我希望它能像这样工作。

const handleEdit = (e,rowData) => {
    <component ={Link} to='Jobs' />
  }

我知道这不是正确的方法，因为反应路由器链接必须位于<button>或<MenuItem>之类的组件内部。

Answer 1

尝试返回EditJob和ListJobs