Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6290

How to make conditional interface base on props in typescript?

$
0
0

what is the best way to implement conditional props, i having something like this, a component that would be a view or a button that base on a props, which i call here CountdownButtonIIt look like this

class CountDownButton extends Component<CountdownButtonI> {  constructor(props:CountdownButtonI) {    super(props);  }  render() {    const { t, title, onPress, time } = this.props;    return time ? (<View style={{ ...Layout.flexView }}><Label text={t('common.countdown.otpCountdown')} style={{ ...LabelStyle.SubBodyText, color: Colors.black }} /><Label          text={moment.utc(time * 1000).format('HH:mm:ss')}          style={{ ...LabelStyle.SubBodyTextMedium, fontWeight: '500', color: Colors.black }}        /></View>    ) : (<TouchableOpacity activeOpacity={1} style={styles.buttonContainer} onPress={onPress}><Label text={title} style={{ ...LabelStyle.BodyTextMedium, color: Colors.white }} /></TouchableOpacity>    );  }}

For CountdownButtonI i set like this

interface CountdownButtonI{  t: any;  title: any;  time: any;}

But i feel it not optimal at all, like, when i have time props, onPress still visible, how can i avoid this, like, if i have time props, the onPress will raise an error


Viewing all articles
Browse latest Browse all 6290

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>