我有一个autocomplete组件,用于呈现标记Autocomplete with tags
我想渲染左边的图标,但只有右边的图标可以正常工作
当前行为
添加左侧图标时,它会显示图标,但不允许呈现textField内的标记
预期行为
添加左侧图标时,应允许呈现textField内的标记
复制步骤:
添加结束图标时工作:
const renderInput = (params: Params): ReactNode => {
if (leftIcon) params.InputProps.endAdornment = <InputAdornment position="end">{leftIcon}</InputAdornment>;
return <TextField {...params} variant="outlined" placeholder={getPlaceHolderText()} />;
};
添加开始图标时不起作用
const renderInput = (params: Params): ReactNode => {
if (leftIcon) params.InputProps.startAdornment = <InputAdornment position="start">{leftIcon}</InputAdornment>;
return <TextField {...params} variant="outlined" placeholder={getPlaceHolderText()} />;
};
1条答案
按热度按时间fafcakar1#
问题是因为标记呈现在
startAdornment
内部,当您将startAdornment
设置为等于图标时,它会删除标记。因此,您可以使用空
htmlTag
(<>
)设置startAdornment
,并在其中呈现相关组件以及startAdornment
之前的内容例:这对我有用