Material-UI自动完成渲染值
弗拉德·波帕（Vlad Popa）
我有一个ReactJs应用程序，它使用具有多个值和复选框的Material-UI自动完成组件，就像它们的代码片段一样：
<Autocomplete
multiple
id="checkboxes-tags-demo"
options={top100Films}
disableCloseOnSelect
getOptionLabel={(option) => option.title}
renderOption={(option, { selected }) => (
<React.Fragment>
<Checkbox
icon={icon}
checkedIcon={checkedIcon}
style={{ marginRight: 8 }}
checked={selected}
/>
{option.title}
</React.Fragment>
)}
style={{ width: 500 }}
renderInput={(params) => (
<TextField {...params} variant="outlined" label="Checkboxes" placeholder="Favorites" />
)}
/>
在检查了一个值之后，将使用“ X”按钮将该值呈现在芯片中，如下所示： 
如何更改，props使渲染后的值显示为“ Value A, Value B, "Value C”，并且它们之间没有逗号？
感谢您的时间
走了
提供自动完成RenderTags道具：
签名：
function（value：T []，getTagProps：function）=> ReactNode
值：提供给组件的值。
getTagProps：标记道具吸气剂。
在您的情况下：
renderTags={(values) =>
values
.map(value => value.title)
.join(', ')
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
组件重新渲染React Material UI时保留“自动完成”值
- 2
在Material-UI自动完成中获取选定的值
- 3
Material UI 无法设置自动完成的默认值
- 4
Material-UI <自动完成/>标签与选项值不同
- 5
设置Material UI自动完成的默认值
- 6
通过material-ui自动完成获取所选值的“ ID”
- 7
material-ui 自动完成自定义值
- 8
截断Material UI自动完成的值（复制Material UI Multiple Select的截断的renderValue）
- 9
自动完成未按预期呈现 Material UI
- 10
Material UI自动完成的多行选项
- 11
Material-UI-TypeScript-通用自动完成
- 12
Material UI - 自动完成默认边距？
- 13
Material-ui 自动完成过滤列表
- 14
使用 Material UI 响应自动完成
- 15
Material UI 反应自动完成设置不同的标签和不同的值
- 16
如何在Material ui自动完成的输入文本字段中显示所选值？
- 17
禁用基于自动完成值的文本字段 React js - Material Ui
- 18
Material-UI自动完成仅在第二次单击时加载值
- 19
material-ui使用带有差异值的自动完成功能，选项类型
- 20
React Hook Form V7 - Material UI 5 自动完成：未验证延迟加载的值
- 21
React Material UI - 如何根据另一个值自动从自动完成中删除项目
- 22
Material-UI 自动完成结束装饰问题
- 23
如何清除material-ui自动完成字段中的文本？
- 24
使 Material UI 自动完成以编程方式获得焦点
- 25
Material UI自动完成上的打字稿平等问题
- 26
在Materialik中使用Material-UI的自动完成组件
- 27
在React material-UI自动完成中获取值
- 28
Material-UI 自动完成仅存储对象的单个属性
- 29
从自动完成内失去React Material UI打开模式
我来说两句