Material ui 使用redux表单材质ui自动完成的redux表单字段
我正在研究redux表单中的自动完成字段,并找到了此解决方案。我认为这将有助于使用material ui或redux表单material ui的用户,并希望消除muiTheme错误。对于我的案例,我发现使用react select很简单Material ui 使用redux表单材质ui自动完成的redux表单字段,material-ui,redux-form,Material Ui,Redux Form,我正在研究redux表单中的自动完成字段,并找到了此解决方案。我认为这将有助于使用material ui或redux表单material ui的用户,并希望消除muiTheme错误。对于我的案例,我发现使用react select很简单 {/* Libraries you need */} import {AutoComplete as MUIAutoComplete} from 'material-ui' import { AutoComplete } from 'redux-form-ma
{/* Libraries you need */}
import {AutoComplete as MUIAutoComplete} from 'material-ui'
import { AutoComplete } from 'redux-form-material-ui'
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
import { reduxForm, Field, Fields, formValueSelector, change } from 'redux-form'
{/* redux-form Field component for Text Input using AutoComplete */}
<MuiThemeProvider>
<Field
name="searchByText"
label="Search Suggestions"
component={AutoComplete}
floatingLabelText="Search By Suggestions"
openOnFocus
filter={MUIAutoComplete.fuzzyFilter}
dataSource={searchSuggestionList} //array list of suggestions
onChange={this.handleSearchByTextChange} //handle the onChange event by handleSearchByTextChange func
onBlur={() => {}}
/>
</MuiThemeProvider>
当您将redux表单材质ui库与redux表单字段一起使用时,是否可以详细说明。就像我使用的自动完成下拉建议和文本字段。它将抛出一个错误,说明需要博物馆。在材质ui库的{AutoComplete}中设置为必需的。为此,我用MuiThemeProvider包装了字段,正如您在代码中看到的那样。这将为材质ui提供默认的交互方式。后来,我工作的项目范围发生了变化,所以我改用了react select。但是这里提供了这个解决方案,以便感兴趣的人可以研究它。