react-admin - react-admin 中的芯片输入
问题描述
如何在 react-admin 中使用 material-ui-chip-input ?
我试图编写这样的代码,但结果没有发送到服务器。
import React from 'react';
import { Field } from 'redux-form';
import ChipInput from 'material-ui-chip-input';
const renderChipInput = ({ input, meta: { touched, error } }) => (
<ChipInput {...input}/>
);
const Chip = () => <Field name="tags" component={renderChipInput} />
export default Chip;
解决方案
它的工作代码
import React from 'react';
import { Field } from 'redux-form';
import ChipInput from 'material-ui-chip-input';
const renderChipInput = ({ input, meta: { touched, error } }) => (
<ChipInput {...input}
value = { input.value || []}
onAdd={(addedChip) => {
let values = input.value || [];
values = values.slice();
values.push(addedChip);
input.onChange(values);
}}
onDelete={(deletedChip) => {
let values = input.value || [];
values = values.filter(v => v !== deletedChip);
input.onChange(values);
}}
onBlur={() => input.onBlur()}
/>
);
const Chip = () => <Field name="tags" component={renderChipInput} />
export default Chip;
推荐阅读
- apache-spark - Apache Spark 如何收集和协调来自执行程序的结果
- mysql - 计算和索引一个月的工作日 - mysql
- java - Android PACT 演示应用程序
- testng - 无法在 TestNG 中使用 testng.xml 按组运行测试
- angular - 无法绑定到“routerLinkActiveOptions”,因为它不是已知属性
- java - 添加时间注释,因为日期在 Rest api 请求上跳过 Gson 序列化
- python - 在创建动态网址时,我得到一个带有参数错误的“dashboard_group”的反向
- openshift - 为什么在openshift中rest api没有从3.x升级到4.x?
- c# - 检查所有表中同一列的值[实体框架]
- ios - 集合视图单元格快速滚动到中心时出现问题