CODEWITHSUNDEEP
javascriptreactjsreact-native
Lawris
Lawris

Reputation: 1035

Slider component not re-rendered

I made a socket connected app, when a value is changed, all the other clients receive the value modification. This is supposed to lead into an automatic UI change.

Here is my code :

<View style={{marginTop:20}}>

     <Slider
        ref="container"
        minimumValue={0}
        maximumValue={100}
        value={this.state.briValue}
        onValueChange={val => {
             this.setState({ briValue: val })
             socketEmit('hue-bri', val)
         }
     }
     />

    <Text>Brightness : {this.state.briValue} %</Text>
</View>

The result :

enter image description here

Issue : the slider thumb does not move

I don't know why the Slider component does not re-render while the Text component does.

I tried to force the reload with this.refs.container.forceUpdate() but it does nothing.

I use the Slider from react-native-elements and the Text component is from the original react-native library.

Any help is greatly appreciated.

Upvotes: 1

Views: 499

Answers (1)

Fawaz
Fawaz

Reputation: 3560

value prop is only used to initialize the slider. Ref : https://facebook.github.io/react-native/docs/slider.html#value

Upvotes: 1

Related Questions