New to React Native and JS as a whole. I'm trying to learn to set state and work with classes. How do I set value to the changed value of the <RangeSlider> component?
Getting this error: ReferenceError: value is not defined
Thanks for the help in advance and apologies for the noob question. If I could get a description or explanation on different ways to handle the scope of variables as well and the manipulation that would be appreciated.
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
value: 0
};
}
render() {
return(
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Form>
<Form.Group>
<Form.Label>
Mood
</Form.Label>
<RangeSlider
value={this.state.value}
onChange={this.setState(value)}
min={1}
max={5}/>
</Form.Group>
</Form>
</View>
);
}
}
When you do setState, you have to pass in an object, and when you have an onChange you need to pass a function, so you probably want either
onChange={(e) => this.setState({value: e.target.value})}
or
onChange={(value) => this.setState({value})}
depending on what RangeSlider returns in it's onChange function (the event or just the value) and you should be good to go