fix uncontrolled article search

This commit is contained in:
刘浩远 2020-06-16 10:10:04 +08:00
parent f017bced35
commit c03e675223

View File

@ -12,7 +12,11 @@ type SearchProps = {
dispatch: AppDispatch dispatch: AppDispatch
} }
class ArticleSearch extends React.Component<SearchProps> { type SearchState = {
query: string
}
class ArticleSearch extends React.Component<SearchProps, SearchState> {
debouncedSearch: (query: string) => void debouncedSearch: (query: string) => void
inputRef: React.RefObject<ISearchBox> inputRef: React.RefObject<ISearchBox>
@ -27,10 +31,12 @@ class ArticleSearch extends React.Component<SearchProps> {
} }
}, 750) }, 750)
this.inputRef = React.createRef<ISearchBox>() this.inputRef = React.createRef<ISearchBox>()
this.state = { query: props.initQuery }
} }
onSearchChange = (_, newValue: string) => { onSearchChange = (_, newValue: string) => {
this.debouncedSearch(newValue) this.debouncedSearch(newValue)
this.setState({ query: newValue })
} }
componentDidUpdate(prevProps: SearchProps) { componentDidUpdate(prevProps: SearchProps) {
@ -45,7 +51,7 @@ class ArticleSearch extends React.Component<SearchProps> {
componentRef={this.inputRef} componentRef={this.inputRef}
className="article-search" className="article-search"
placeholder={intl.get("search")} placeholder={intl.get("search")}
defaultValue={this.props.initQuery} value={this.state.query}
onChange={this.onSearchChange} /> onChange={this.onSearchChange} />
) )
} }