diff options
author | derek <wwsage@gmail.com> | 2020-07-13 00:19:34 -0400 |
---|---|---|
committer | derek <wwsage@gmail.com> | 2020-07-13 20:14:01 -0400 |
commit | 47548905ce1b20035ffa467391f06280b6fbfcb4 (patch) | |
tree | df83020eb7ff82bd699a354a6e9b65bd651b0225 /ui/src/components/data-type-select.tsx | |
parent | 195bf022bb38499754263f71d52b0596ebd0e333 (diff) |
ui.components: fix selector components to work with browser buttons
Use getDerivedState to set state and only send back props
Diffstat (limited to 'ui/src/components/data-type-select.tsx')
-rw-r--r-- | ui/src/components/data-type-select.tsx | 15 |
1 files changed, 10 insertions, 5 deletions
diff --git a/ui/src/components/data-type-select.tsx b/ui/src/components/data-type-select.tsx index f2539c81..8e905bf4 100644 --- a/ui/src/components/data-type-select.tsx +++ b/ui/src/components/data-type-select.tsx @@ -25,6 +25,12 @@ export class DataTypeSelect extends Component< this.state = this.emptyState; } + static getDerivedStateFromProps(props) { + return { + type_: props.type_, + }; + } + render() { return ( <div class="btn-group btn-group-toggle"> @@ -42,8 +48,9 @@ export class DataTypeSelect extends Component< {i18n.t('posts')} </label> <label - className={`pointer btn btn-sm btn-secondary ${this.state.type_ == - DataType.Comment && 'active'}`} + className={`pointer btn btn-sm btn-secondary ${ + this.state.type_ == DataType.Comment && 'active' + }`} > <input type="radio" @@ -58,8 +65,6 @@ export class DataTypeSelect extends Component< } handleTypeChange(i: DataTypeSelect, event: any) { - i.state.type_ = Number(event.target.value); - i.setState(i.state); - i.props.onChange(i.state.type_); + i.props.onChange(Number(event.target.value)); } } |