I am try to change state in parent component onChange event.
On click on Checkbox state includeExtremeClaims
should be changed into true
.
Parent Component:
export class ManageAnalytics extends Component {
static contextTypes = baseContextTypes
state = {
includeExtremeClaims: false
}
handleChange = (e, { name, value } = {}) => {
this.setState({ [name]: value })
}
render() {
return (
<div>
// Passing down handleChange and includeExtremeClaims state as props
<Analytics
handleChange={this.handleChange}
includeExtremeClaims={this.state.includeExtremeClaims}
/>
</div>
)
}
Child Compnent:
export class Analytics extends Component {
static contextTypes = baseContextTypes
render() {
const { handleChange, includeExtremeClaims } = this.props
return (
<Checkbox
label="Include Extreme Cases"
name="includeExtremeClaims"
onChange={handleChange}
value={includeExtremeClaims}
/>
)
}
Question is : On click on Checkbox Why my state is not changed?
Problem was in value which is provide on Checkbox, value is always the same, that is reason why is not changed:
value={includeExtremeClaims}
it should be value={!includeExtremeClaims}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.