Rename ToastAndroid to ToastExample
Summary: The `ToastAndroid` module already exists in react native. In its current form, the tutorial will cause an error, as then there would be two `ToastAndroid`s. This PR addresses that by naming the new module `ToastExample`. Tested this by running the doc website with my changes, here's a clip ![image](https://user-images.githubusercontent.com/3833164/28682102-563409fe-72c1-11e7-8316-a8a39e32b539.png) The production site with the old doc has 14 `ToastAndroid`s, with one referring to the real module doc ![image](https://user-images.githubusercontent.com/3833164/28682204-a3520e02-72c1-11e7-93eb-332f84f38f57.png) This PR now as 13 `ToastExample` references, one less because the `ToastAndroid` module is still on the left-side doc, as it should be. ![image](https://user-images.githubusercontent.com/3833164/28682272-da3cafbc-72c1-11e7-8c19-25b035c0a6eb.png) Closes https://github.com/facebook/react-native/pull/15238 Differential Revision: D5509726 Pulled By: hramos fbshipit-source-id: 33231529d1d83813960e8237ce75910b32024396
This commit is contained in:
parent
7ac6fa7a10
commit
f193c3f2b1
|
@ -21,7 +21,7 @@ If you plan to make changes in Java code, we recommend enabling [Gradle Daemon](
|
|||
|
||||
This guide will use the [Toast](http://developer.android.com/reference/android/widget/Toast.html) example. Let's say we would like to be able to create a toast message from JavaScript.
|
||||
|
||||
We start by creating a native module. A native module is a Java class that usually extends the `ReactContextBaseJavaModule` class and implements the functionality required by the JavaScript. Our goal here is to be able to write `ToastAndroid.show('Awesome', ToastAndroid.SHORT);` from JavaScript to display a short toast on the screen.
|
||||
We start by creating a native module. A native module is a Java class that usually extends the `ReactContextBaseJavaModule` class and implements the functionality required by the JavaScript. Our goal here is to be able to write `ToastExample.show('Awesome', ToastExample.SHORT);` from JavaScript to display a short toast on the screen.
|
||||
|
||||
```java
|
||||
package com.facebook.react.modules.toast;
|
||||
|
@ -48,12 +48,12 @@ public class ToastModule extends ReactContextBaseJavaModule {
|
|||
}
|
||||
```
|
||||
|
||||
`ReactContextBaseJavaModule` requires that a method called `getName` is implemented. The purpose of this method is to return the string name of the `NativeModule` which represents this class in JavaScript. So here we will call this `ToastAndroid` so that we can access it through `React.NativeModules.ToastAndroid` in JavaScript.
|
||||
`ReactContextBaseJavaModule` requires that a method called `getName` is implemented. The purpose of this method is to return the string name of the `NativeModule` which represents this class in JavaScript. So here we will call this `ToastExample` so that we can access it through `React.NativeModules.ToastExample` in JavaScript.
|
||||
|
||||
```java
|
||||
@Override
|
||||
public String getName() {
|
||||
return "ToastAndroid";
|
||||
return "ToastExample";
|
||||
}
|
||||
```
|
||||
|
||||
|
@ -146,23 +146,23 @@ To make it simpler to access your new functionality from JavaScript, it is commo
|
|||
```js
|
||||
'use strict';
|
||||
/**
|
||||
* This exposes the native ToastAndroid module as a JS module. This has a
|
||||
* This exposes the native ToastExample module as a JS module. This has a
|
||||
* function 'show' which takes the following parameters:
|
||||
*
|
||||
* 1. String message: A string with the text to toast
|
||||
* 2. int duration: The duration of the toast. May be ToastAndroid.SHORT or
|
||||
* ToastAndroid.LONG
|
||||
* 2. int duration: The duration of the toast. May be ToastExample.SHORT or
|
||||
* ToastExample.LONG
|
||||
*/
|
||||
import { NativeModules } from 'react-native';
|
||||
module.exports = NativeModules.ToastAndroid;
|
||||
module.exports = NativeModules.ToastExample;
|
||||
```
|
||||
|
||||
Now, from your other JavaScript file you can call the method like this:
|
||||
|
||||
```js
|
||||
import ToastAndroid from './ToastAndroid';
|
||||
import ToastExample from './ToastExample';
|
||||
|
||||
ToastAndroid.show('Awesome', ToastAndroid.SHORT);
|
||||
ToastExample.show('Awesome', ToastExample.SHORT);
|
||||
```
|
||||
|
||||
## Beyond Toasts
|
||||
|
|
Loading…
Reference in New Issue