阻止芯片组件发送REST请求



我有以下代码:

import React from 'react';
import PropTypes from 'prop-types';
import Chip from '@material-ui/core/Chip';
import withStyles from '@material-ui/core/styles/withStyles';
const styles = {
root: {
margin: 4,
},
};
function CustomChipField({ root, classes, record, onClick }) {
return (
<Chip className={classes.root} label={`${record.name}`} onClick={onClick} />
);
}
CustomChipField.propTypes = {
classes: PropTypes.shape({}).isRequired,
record: PropTypes.shape({}),
onClick: PropTypes.func.isRequired,
};
CustomChipField.defaultProps = {
record: {},
};
export default withStyles(styles)(CustomChipField);

它是什么?它是一个自定义芯片组件,继承了材料ui的芯片。

但我还没有弄清楚为什么当我点击它时它会发送REST请求。
这样一个请求的例子:http://localhost:3000/#/users/{"name"3A"whatever_name"}

我有一个onClick道具覆盖,我试图覆盖它,但它什么都没做。

我在react admin的SingleFieldList中使用了这个组件,也许是react admin中的问题,但我使用了直接从material ui继承的自定义芯片组件。

代码来自react admin:

export const UserList = props => (
<List {...props}>
<Datagrid rowClick="edit">
<TextField source="id" />
<TextField source="username" />
<ArrayField source="some_array">
<SingleFieldList>
<CustomChipField
source="name"
size="small"
clickable={true}
onClick={handleClick}
/>
</SingleFieldList>
</ArrayField>
</Datagrid>
</List>
);

再一次-点击道具不起作用。

所以问题是:如何防止芯片组件发送REST请求,是否对其进行自定义

这对我有效:

<SingleFieldList linkType={false}>
<CustomChipField />
</SingleFieldList>

最新更新