diff --git a/Example/ExampleMain.js b/Example/ExampleMain.js index 5622723..cef7041 100644 --- a/Example/ExampleMain.js +++ b/Example/ExampleMain.js @@ -12,28 +12,25 @@ class ExampleMain extends Component { this.state = { selectedIndex: 0, badgesStyleIndex: 0, - customStyleIndex: 0, + customStyleIndex: 0 } } handleSingleIndexSelect = (index) => { this.setState({ - ...this.state, - selectedIndex: index, + selectedIndex: index }); } handleBadgesSelect = (index) => { this.setState({ - ...this.state, - badgesStyleIndex: index, + badgesStyleIndex: index }); } handleCustomIndexSelect = (index) => { this.setState({ - ...this.state, - customStyleIndex: index, + customStyleIndex: index }); } diff --git a/Example/README.md b/Example/README.md index 5edcba0..e37c836 100644 --- a/Example/README.md +++ b/Example/README.md @@ -34,6 +34,19 @@ Updating the `react-native-scripts` dependency of your app should be as simple a Upgrading to a new version of React Native requires updating the `react-native`, `react`, and `expo` package versions, and setting the correct `sdkVersion` in `app.json`. See the [versioning guide](https://github.com/react-community/create-react-native-app/blob/master/VERSIONS.md) for up-to-date information about package version compatibility. +# Example +To run this example +1. create a symlink package from the root directory, as shown below: +```shell +npm link +``` +2. switch to the example folder and then run `yarn start` command, which would launch the app on simulator using the [expo](https://expo.io/) app + +```shell +cd Example +yarn start +``` + ## Available Scripts If Yarn was installed when the project was initialized, then dependencies will have been installed via Yarn, and you should probably use it to run these commands as well. Unlike dependency installation, command running syntax is identical for Yarn and NPM at the time of this writing. diff --git a/Example/package-lock.json b/Example/package-lock.json index 7c672f5..78b9b6d 100644 --- a/Example/package-lock.json +++ b/Example/package-lock.json @@ -8459,6 +8459,9 @@ } } }, + "react-native-segmented-control-ui": { + "version": "file:.." + }, "react-native-svg": { "version": "6.2.2", "resolved": "https://registry.npmjs.org/react-native-svg/-/react-native-svg-6.2.2.tgz", diff --git a/Example/package.json b/Example/package.json index 1a4d112..226153a 100644 --- a/Example/package.json +++ b/Example/package.json @@ -22,6 +22,6 @@ "expo": "^27.0.1", "react": "16.3.1", "react-native": "~0.55.2", - "react-native-segmented-control-ui": "1.0.0" + "react-native-segmented-control-ui": "file:.." } } diff --git a/README.md b/README.md index 59f7844..81428f4 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,12 @@ A react native component similar to iOS SegmentedControl, Primarily built to support both IOS and Android. # Example -To run example +To run the example +1. create a symlink package from the root directory, as shown below: +```shell +npm link +``` +2. switch to the example folder and then run `yarn start` command, which would launch the app on simulator using the [expo](https://expo.io/) app ```shell cd Example @@ -25,19 +30,18 @@ yarn start ```javascript import SegmentedControlTab from 'react-native-segmented-control-ui' -class ConsumerComponent extends Component { +const ConsumerComponent extends Component { constructor(){ super() this.state = { - selectedIndex: 0, + selectedIndex: 0 }; } handleIndexChange = (index) => { this.setState({ - ...this.state, - selectedIndex: index, + selectedIndex: index }); } diff --git a/package-lock.json b/package-lock.json index c9f35a6..8e18fec 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,5 +1,5 @@ { "name": "react-native-segmented-control-ui", - "version": "1.0.0", + "version": "1.0.1", "lockfileVersion": 1 } diff --git a/package.json b/package.json index 3380510..674168d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-segmented-control-ui", - "version": "1.0.0", + "version": "1.0.1", "description": "SegmentedControl using react-native,support android and ios", "main": "index.js", "scripts": {