材质自动完成功能不适用于InputProps

时间:2019-11-10 17:47:32

标签: javascript reactjs autocomplete material-ui textfield

我正在尝试更改通过TextField渲染的Autocomplete的边框,但是当我添加InputProps道具时,Autocomplete不再渲染{ {1}} s

Chip

上面的代码有效,一旦取消注释<Autocomplete multiple freeSolo options={options} renderTags={(value, { className, onDelete }) => value.map((option, index) => ( <Chip key={index} variant="outlined" data-tag-index={index} tabIndex={-1} label={option} className={className} color="secondary" onDelete={onDelete} /> )) } renderInput={(params) => ( <TextField {...params} id={id} className={textFieldStyles.searchField} label={label} value={value} onChange={onChange} variant="outlined" //InputProps={{ // classes: { // input: textFieldStyles.input, // notchedOutline: textFieldStyles.notchedOutline // } //}} InputLabelProps={{ classes: { root: textFieldStyles.label } }} /> )} /> 行,在选择或输入项目时,输入将不再呈现InputProps

谢谢

1 个答案:

答案 0 :(得分:0)

发生这种情况是因为InputProps属性覆盖了params的InputProps参数,您必须合并params的InputProps属性:

InputProps={{
    ...params.InputProps,
    classes: {
        input: textFieldStyles.input,
        notchedOutline: textFieldStyles.notchedOutline
    }
}}