如何仅通过单击编辑按钮进行编辑

Question

React admin-一个前端框架，用于构建在REST/GraphQLAPI之上的浏览器中运行的数据驱动应用程序，使用ES6、React和Material Design。由marmelab开源和维护。

单击PostList中行的任何部分都将打开编辑表单，如何通过单击编辑按钮进行编辑。

我举了一个例子来演示这种行为代码沙盒

post.tsx

export const PostList = () => (
<List>
<Datagrid rowClick="edit">
<TextField source="id" />
<ReferenceField source="userId" reference="users">
<TextField source="name" />
</ReferenceField>
<TextField source="title" />
<EditButton />
</Datagrid>
</List>
);

App.tsx

const App = () => (
<Admin dataProvider={dataProvider}>
<Resource name="posts" list={PostList} edit={PostEdit} />
<Resource name="users" list={UserList} />
</Admin>
);

如果i commentedit＝｛PostList｝编辑按钮不工作

const App = () => (
<Admin dataProvider={dataProvider}>
<Resource name="posts" list={PostList} /*edit={PostEdit}*/ />
<Resource name="users" list={UserList} />
</Admin>
);

我只想通过点击编辑按钮来编辑帖子

Answer 1

您需要从数据网格中删除rowClick="edit"

export const PostList = () => (
<List>
<Datagrid> // remove rowClick="edit"
<TextField source="id" />
<ReferenceField source="userId" reference="users">
<TextField source="name" />
</ReferenceField>
<TextField source="title" />
<EditButton />
</Datagrid>
</List>
);