Skip to content

Commit

Permalink
Docs: Add example to CheckBox documentation
Browse files Browse the repository at this point in the history
Summary:
I find it easier to understand the behavior of a component when there is a simple example showing its usage. I recently used the CheckBox component and noticed that it doesn't have a code example. This PR adds an example to the CheckBox documentation.

N/A

[DOCS][ENHANCEMENT][CheckBox] - Added example to documentation
Closes #16489

Differential Revision: D6260998

Pulled By: hramos

fbshipit-source-id: 7c6f9677741a4c0483eb1f5405cd05f8bbdd83aa
  • Loading branch information
Adriano Melo authored and facebook-github-bot committed Nov 7, 2017
1 parent 45ed142 commit e906525
Showing 1 changed file with 44 additions and 0 deletions.
44 changes: 44 additions & 0 deletions Libraries/Components/CheckBox/CheckBox.android.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,50 @@ type DefaultProps = {
* If the `value` prop is not updated, the component will continue to render
* the supplied `value` prop instead of the expected result of any user actions.
*
* ```
* import React from 'react';
* import { AppRegistry, StyleSheet, Text, View, CheckBox } from 'react-native';
*
* export default class App extends React.Component {
* constructor(props) {
* super(props);
* this.state = {
* checked: false
* }
* }
*
* toggle() {
* this.setState(({checked}) => {
* return {
* checked: !checked
* };
* });
* }
*
* render() {
* const {checked} = this.state;
* return (
* <View style={styles.container}>
* <Text>Checked</Text>
* <CheckBox value={checked} onChange={this.toggle.bind(this)} />
* </View>
* );
* }
* }
*
* const styles = StyleSheet.create({
* container: {
* flex: 1,
* flexDirection: 'row',
* alignItems: 'center',
* justifyContent: 'center',
* },
* });
*
* // skip this line if using Create React Native App
* AppRegistry.registerComponent('App', () => App);
* ```
*
* @keyword checkbox
* @keyword toggle
*/
Expand Down

0 comments on commit e906525

Please sign in to comment.