时间戳

首页 > 解决方案 > 在 React Native 中浮动到 Int

react-native - 在 React Native 中浮动到 Int

问题描述

我仍然是反应原生的新手。我希望你们能帮助我。我想在滑块中将 float 更改为 int 。（在 onValueChange 中）

这是我的代码：

                        <Section style={{padding:10, backgroundColor:'white', borderRadius:10, marginTop:30}}>
                            <Block xsSize='1/2' smSize='1/2'>
                              <Slider
                                style={{width: 200, height: 40}}
                                minimumValue={1}
                                maximumValue={100}
                                minimumTrackTintColor="#0197ca"
                                maximumTrackTintColor="#a2a2a2"
                                onValueChange={(value) => this.setState({sliderState:value})}
                             />
                            </Block>

                            <Block xsSize='1/2' smSize='1/2' style={{padding:10, borderRadius:5, backgroundColor:'#0197ca', width:60, position:'relative', left:90}}>
                                <Text style={{color:'white'}}>{this.state.sliderState}%</Text>
                            </Block>     
                        </Section>

我想将输出更改为<Text style={{color:'white'}}>{this.state.sliderState}%</Text>int。现在，输出仍然是浮动的。

标签： react-nativemobilereact-native-android

解决方案

当您希望值以某种方式出现时，请确保在设置状态时进行更改。
这样，您就可以按照您想要的方式格式化您的值。
试试这个：

<Section style={{padding:10, backgroundColor:'white', borderRadius:10, marginTop:30}}>
 <Block xsSize='1/2' smSize='1/2'>
  <Slider
         style={{width: 200, height: 40}}
         minimumValue={1}
         maximumValue={100}
         minimumTrackTintColor="#0197ca"
         maximumTrackTintColor="#a2a2a2"
         onValueChange={(value) =>this.setState({sliderState:Math.round(value)})}
   />
  </Block>
 <Block
   xsSize='1/2'
   smSize='1/2' 
   style={{padding:10, borderRadius:5, backgroundColor:'#0197ca', width:60, position:'relative', left:90}}>
   <Text style={{color:'white'}}>
        {this.state.sliderState}%
    </Text>
  </Block>     
</Section>

推荐阅读