Skip to content

Instantly share code, notes, and snippets.

@ovpv

ovpv/meter.js

Created Sep 2, 2019
Embed
What would you like to do?
Meter component to show the password strength
class Meter extends React.Component{
constructor(){
super();
this.state={
status: "low"
}
}
componentDidUpdate(prevprops,state){
this.changeStatus(this.props.value);
}
changeStatus = (value) => {
switch(value){
case 10:
this.setState({
status: "low"
})
break;
case 50:
this.setState({
status: "medium"
})
break;
case 100:
this.setState({
status: "high"
})
break;
}
}
render(){
return (
<span className={`progress ${this.state.status}`}></span>
)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment