nuke-switch
v2.3.12 nuke nuke-switch
Switch
- category: Components
- chinese: 开关
- type: Basic
Usage
Switch
is a switch button component with status switching.
API
Attribute | Description | Type | Default |
---|---|---|---|
disabled | Is the switch interactive? | boolean | true |
checked | Turn on or off(Controlled usage, Need to cooperate with onValueChange) | boolean | false |
defaultChecked | Default selection(uncontrolled usage) | boolean | false |
onValueChange | call this function when Switch changes | function(value) | null |
Usage in controlled or uncontrolled
All input and interaction class components have controlled usage and uncontrolled usage.
- Controlled usage: component status is affected by external incoming props. The external props changes, so that the components will change, such as:
constructor() {
super();
this.state = {
checked: true
}
}
change = (value) => {
this.setState({
checked:!value
});
}
//...
render(){
return (<Switch checked={this.state.checked} onValueChange={this.change}/>)
}
- Uncontrolled usage: The component itself changes freely and changes what is externally changed through the event, such as:
change = (value) => {
console.log('switch change to: ',value);
}
//...
render(){
return (<Switch defaultChecked={true} onValueChange={this.change}/>)
}
The Other
- Chat with @翊晨[yichen] in Dingtalk desktop App Download
- DingTalk Group
npm i nuke-switch
Source Code
[email protected]:n...Metadata
- Apache-2.0
- Whatever
- leanhunter
- released 9/26/2019