Devanada
Devanada

Reputation: 177

Hide or Show Component On Certain Time React Native

like the title says, I want to show or hide on a certain time or working time, let's say 8 AM till 4 PM, the button will show on those time, otherwise it will be hidden. how can I achieve that? Thanks

Note: sorry if there is no code because I'm confused on how can I achieve that

Upvotes: 0

Views: 310

Answers (2)

Devanada
Devanada

Reputation: 177

This is what I do and it worked,

var format = "hh:mm:ss";
var time = Moment(this.props.route.params.timeServer, format),
   beforeTime = Moment(this.props.route.params.time.jam_masuk, format),
   afterTime = Moment(this.props.route.params.time.jam_pulang, format);
if (time.isBetween(beforeTime, afterTime)) {
   this.setState({ showButton: true });
} else {
   this.setState({ showButton: false });
}

Upvotes: 0

Quentin Nippert
Quentin Nippert

Reputation: 107

You should use a condition in your component's return :

// above your component's return

const [hours, setHours] = useState(new Date().getHours()); 



// in your component's return (<Button /> is a react an element from react-native-elements) :

{hours > 8 && hours < 16 ? <Button title='Show me between 8AM and 4PM'/>} 

Upvotes: 1

Related Questions