React Native countDown Timer 使用 Json 响应对象作为限制日期
React Native countDown Timer using a Json response object as a limit date
我正在尝试使用倒数计时器,使用 json 响应作为限制日期(将 until={this.state.totalDuration} 替换为 until={item.date} )
但我失败了,我总是有 NaN NaN NaN 。如果我直接更改 until 值,例如 (until={'2020-12-12'}) 我在倒计时中没有得到 NaN NaN NaN,但我得到一个从 30 分钟开始倒计时的倒计时,那是尴尬
<Content >
<View style ={{ flex:1}}>
<FlatList
data={this.state.data}
keyExtractor={(item,index) => index.toString()}
renderItem={({item}) =>
<View style={{backgroundColor:'#e6e6e6',padding:10,margin:10}}>
<ListItem icon>
<Left>
<Button style={{ backgroundColor: "white" }}>
<Icon0 active name="doctor" />
</Button>
</Left>
<Body>
<Text>Nom du Docteur : Dr. {item.nom}</Text>
</Body>
</ListItem>
<ListItem icon>
<Left>
<Button style={{ backgroundColor: "white" }}>
<Icon1 active name="calendar" />
</Button>
</Left>
<Body>
<Text>Date du rendez-vous : {item.date}</Text>
</Body>
</ListItem>
<ListItem icon>
<Left>
<Button>
<Icon1 active name="calendar"/>
</Button>
</Left>
<Body>
<CountDown
until={item.date}
timetoShow={('H', 'M', 'S')}
onFinish={() => alert('finished')}
onPress={() => alert('hello')}
size={10}
/>
</Body>
</ListItem>
</View>
}
/>
</View>
</Content>
编辑:* 导入
import CountDown from 'react-native-countdown-component';
import moment from 'moment';
问题是在 'react-native-countdown-component' 中,until 接受一个整数参数,即日期是秒数,因此您必须将日期转换为秒数。
我正在尝试使用倒数计时器,使用 json 响应作为限制日期(将 until={this.state.totalDuration} 替换为 until={item.date} ) 但我失败了,我总是有 NaN NaN NaN 。如果我直接更改 until 值,例如 (until={'2020-12-12'}) 我在倒计时中没有得到 NaN NaN NaN,但我得到一个从 30 分钟开始倒计时的倒计时,那是尴尬
<Content >
<View style ={{ flex:1}}>
<FlatList
data={this.state.data}
keyExtractor={(item,index) => index.toString()}
renderItem={({item}) =>
<View style={{backgroundColor:'#e6e6e6',padding:10,margin:10}}>
<ListItem icon>
<Left>
<Button style={{ backgroundColor: "white" }}>
<Icon0 active name="doctor" />
</Button>
</Left>
<Body>
<Text>Nom du Docteur : Dr. {item.nom}</Text>
</Body>
</ListItem>
<ListItem icon>
<Left>
<Button style={{ backgroundColor: "white" }}>
<Icon1 active name="calendar" />
</Button>
</Left>
<Body>
<Text>Date du rendez-vous : {item.date}</Text>
</Body>
</ListItem>
<ListItem icon>
<Left>
<Button>
<Icon1 active name="calendar"/>
</Button>
</Left>
<Body>
<CountDown
until={item.date}
timetoShow={('H', 'M', 'S')}
onFinish={() => alert('finished')}
onPress={() => alert('hello')}
size={10}
/>
</Body>
</ListItem>
</View>
}
/>
</View>
</Content>
编辑:* 导入
import CountDown from 'react-native-countdown-component';
import moment from 'moment';
问题是在 'react-native-countdown-component' 中,until 接受一个整数参数,即日期是秒数,因此您必须将日期转换为秒数。