Ensure documentation has consistent relative links
Summary: Explain the **motivation** for making this change. What existing problem does the pull request solve? I had tried fixing a broken link in a previous commit (#11453). My commit was merged, but it did not resolve the underlying problem. I have looked into how links should be formed for the docs and have fixed the original problem as well as updated all other links to be consistent. Previous link formats: - /docs/sample.html <-- broken link - sample.html <-- broken link - https://facebook.github.io/react-native/docs/sample.html <-- works - /react-native/docs/sample.html <-- works - docs/sample.html <-- works (permalink format) This PR updates all links to the permalink format. **Test plan (required)** I ran the website locally and manually tested half of the links in each category. They all worked. ``` $ cd website $ npm install && npm start ``` Closes https://github.com/facebook/react-native/pull/12064 Differential Revision: D4489153 Pulled By: mkonicek fbshipit-source-id: bf0231d941ba147317595c3b3466dc579a887169
This commit is contained in:
parent
4344e064e7
commit
8378f0f9f7
|
@ -100,7 +100,7 @@ type ButtonsArray = Array<{
|
|||
* );
|
||||
* ```
|
||||
*
|
||||
* We recommend using the [`Alert.alert`](alert.html) method for
|
||||
* We recommend using the [`Alert.alert`](docs/alert.html) method for
|
||||
* cross-platform support if you don't need to create iOS-only prompts.
|
||||
*
|
||||
*/
|
||||
|
|
|
@ -111,7 +111,7 @@ var getPhotosReturnChecker = createStrictShapeTypeChecker({
|
|||
/**
|
||||
* `CameraRoll` provides access to the local camera roll / gallery.
|
||||
* Before using this you must link the `RCTCameraRoll` library.
|
||||
* You can refer to [Linking](https://facebook.github.io/react-native/docs/linking-libraries-ios.html) for help.
|
||||
* You can refer to [Linking](docs/linking-libraries-ios.html) for help.
|
||||
*
|
||||
* ### Permissions
|
||||
* The user's permission is required in order to access the Camera Roll on devices running iOS 10 or later.
|
||||
|
|
|
@ -29,8 +29,8 @@ const invariant = require('fbjs/lib/invariant');
|
|||
* <center><img src="img/buttonExample.png"></img></center>
|
||||
*
|
||||
* If this button doesn't look right for your app, you can build your own
|
||||
* button using [TouchableOpacity](https://facebook.github.io/react-native/docs/touchableopacity.html)
|
||||
* or [TouchableNativeFeedback](https://facebook.github.io/react-native/docs/touchablenativefeedback.html).
|
||||
* button using [TouchableOpacity](docs/touchableopacity.html)
|
||||
* or [TouchableNativeFeedback](docs/touchablenativefeedback.html).
|
||||
* For inspiration, look at the [source code for this button component](https://github.com/facebook/react-native/blob/master/Libraries/Components/Button.js).
|
||||
* Or, take a look at the [wide variety of button components built by the community](https://js.coach/react-native?search=button).
|
||||
*
|
||||
|
|
|
@ -133,7 +133,7 @@ type Event = Object;
|
|||
* animations and behavior from UIKIt.
|
||||
*
|
||||
* As the name implies, it is only available on iOS. Take a look at
|
||||
* [`Navigator`](/react-native/docs/navigator.html) for a similar solution for your
|
||||
* [`Navigator`](docs/navigator.html) for a similar solution for your
|
||||
* cross-platform needs, or check out
|
||||
* [react-native-navigation](https://github.com/wix/react-native-navigation), a
|
||||
* component that aims to provide native navigation on both iOS and Android.
|
||||
|
|
|
@ -482,7 +482,7 @@ const TextInput = React.createClass({
|
|||
* see [Issue#7070](https://github.com/facebook/react-native/issues/7070)
|
||||
* for more detail.
|
||||
*
|
||||
* [Styles](/react-native/docs/style.html)
|
||||
* [Styles](docs/style.html)
|
||||
*/
|
||||
style: Text.propTypes.style,
|
||||
/**
|
||||
|
|
|
@ -76,9 +76,9 @@ const statics = {
|
|||
|
||||
/**
|
||||
* The most fundamental component for building a UI, `View` is a container that supports layout with
|
||||
* [flexbox](/react-native/docs/flexbox.html), [style](/react-native/docs/style.html),
|
||||
* [some touch handling](/react-native/docs/handling-touches.html), and
|
||||
* [accessibility](/react-native/docs/accessibility.html) controls. `View` maps directly to the
|
||||
* [flexbox](docs/flexbox.html), [style](docs/style.html),
|
||||
* [some touch handling](docs/handling-touches.html), and
|
||||
* [accessibility](docs/accessibility.html) controls. `View` maps directly to the
|
||||
* native view equivalent on whatever platform React Native is running on, whether that is a
|
||||
* `UIView`, `<div>`, `android.view`, etc.
|
||||
*
|
||||
|
@ -101,7 +101,7 @@ const statics = {
|
|||
* }
|
||||
* ```
|
||||
*
|
||||
* > `View`s are designed to be used with [`StyleSheet`](/react-native/docs/style.html) for clarity
|
||||
* > `View`s are designed to be used with [`StyleSheet`](docs/style.html) for clarity
|
||||
* > and performance, although inline styles are also supported.
|
||||
*
|
||||
* ### Synthetic Touch Events
|
||||
|
@ -243,7 +243,7 @@ const View = React.createClass({
|
|||
* - `'allowsDirectInteraction'` - The element allows direct touch interaction for VoiceOver users.
|
||||
* - `'pageTurn'` - Informs VoiceOver that it should scroll to the next page when it finishes reading the contents of the element.
|
||||
*
|
||||
* See the [Accessibility guide](/react-native/docs/accessibility.html#accessibilitytraits-ios)
|
||||
* See the [Accessibility guide](docs/accessibility.html#accessibilitytraits-ios)
|
||||
* for more information.
|
||||
*
|
||||
* @platform ios
|
||||
|
|
|
@ -289,7 +289,7 @@ var GESTURE_ACTIONS = [
|
|||
* ```
|
||||
* In the above example, the newly pushed scene will float up from the bottom.
|
||||
* See `Navigator.SceneConfigs` for default animations and more info on
|
||||
* available [scene config options](/react-native/docs/navigator.html#configurescene).
|
||||
* available [scene config options](docs/navigator.html#configurescene).
|
||||
*/
|
||||
var Navigator = React.createClass({
|
||||
|
||||
|
|
|
@ -185,7 +185,7 @@ const Text = React.createClass({
|
|||
* for a `Text` element is `true`.
|
||||
*
|
||||
* See the
|
||||
* [Accessibility guide](/react-native/docs/accessibility.html#accessible-ios-android)
|
||||
* [Accessibility guide](docs/accessibility.html#accessible-ios-android)
|
||||
* for more information.
|
||||
*/
|
||||
accessible: PropTypes.bool,
|
||||
|
|
|
@ -144,7 +144,7 @@ gradle.projectsLoaded {
|
|||
|
||||
## Testing
|
||||
|
||||
If you made changes to React Native and submit a pull request, all tests will run on your pull request automatically. To run the tests locally, see [Testing](/react-native/docs/testing.html).
|
||||
If you made changes to React Native and submit a pull request, all tests will run on your pull request automatically. To run the tests locally, see [Testing](docs/testing.html).
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
|
|
|
@ -10,7 +10,7 @@ next: tutorial
|
|||
Welcome to React Native! This page will help you install React Native on
|
||||
your system, so that you can build apps with it right away. If you already
|
||||
have React Native installed, you can skip ahead to the
|
||||
[Tutorial](/react-native/docs/tutorial.html).
|
||||
[Tutorial](docs/tutorial.html).
|
||||
|
||||
The instructions are a bit different depending on your development operating system, and whether you want to start developing for iOS or Android. If you
|
||||
want to develop for both iOS and Android, that's fine - you just have to pick
|
||||
|
|
|
@ -8,7 +8,7 @@ next: using-a-scrollview
|
|||
previous: flexbox
|
||||
---
|
||||
|
||||
[`TextInput`](/react-native/docs/textinput.html#content) is a basic component that allows the user to enter text. It has an `onChangeText` prop that takes
|
||||
[`TextInput`](docs/textinput.html#content) is a basic component that allows the user to enter text. It has an `onChangeText` prop that takes
|
||||
a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted.
|
||||
|
||||
For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated
|
||||
|
@ -45,6 +45,6 @@ AppRegistry.registerComponent('PizzaTranslator', () => PizzaTranslator);
|
|||
|
||||
In this example, we store `text` in the state, because it changes over time.
|
||||
|
||||
There are a lot more things you might want to do with a text input. For example, you could validate the text inside while the user types. For more detailed examples, see the [React docs on controlled components](https://facebook.github.io/react/docs/forms.html), or the [reference docs for TextInput](/react-native/docs/textinput.html).
|
||||
There are a lot more things you might want to do with a text input. For example, you could validate the text inside while the user types. For more detailed examples, see the [React docs on controlled components](https://facebook.github.io/react/docs/forms.html), or the [reference docs for TextInput](docs/textinput.html).
|
||||
|
||||
Text input is probably the simplest example of a component whose state naturally changes over time. Next, let's look at another type of component like this one that controls layout, and [learn about the ScrollView](/react-native/docs/using-a-scrollview.html).
|
||||
Text input is probably the simplest example of a component whose state naturally changes over time. Next, let's look at another type of component like this one that controls layout, and [learn about the ScrollView](docs/using-a-scrollview.html).
|
||||
|
|
|
@ -10,7 +10,7 @@ previous: images
|
|||
|
||||
Users interact with mobile apps mainly through touch. They can use a combination of gestures, such as tapping on a button, scrolling a list, or zooming on a map.
|
||||
|
||||
React Native provides components to handle common gestures, such as taps and swipes, as well as a comprehensive [gesture responder system](/react-native/docs/gesture-responder-system.html) to allow for more advanced gesture recognition.
|
||||
React Native provides components to handle common gestures, such as taps and swipes, as well as a comprehensive [gesture responder system](docs/gesture-responder-system.html) to allow for more advanced gesture recognition.
|
||||
|
||||
## Tappable Components
|
||||
|
||||
|
@ -38,13 +38,13 @@ Tappable components should provide feedback that show the user what is handling
|
|||
|
||||
Which component you use will depend on what kind of feedback you want to provide:
|
||||
|
||||
- Generally, you can use [**TouchableHighlight**](/react-native/docs/touchablehighlight.html) anywhere you would use a button or link on web. The view's background will be darkened when the user presses down on the button.
|
||||
- Generally, you can use [**TouchableHighlight**](docs/touchablehighlight.html) anywhere you would use a button or link on web. The view's background will be darkened when the user presses down on the button.
|
||||
|
||||
- You may consider using [**TouchableNativeFeedback**](/react-native/docs/touchablenativefeedback.html) on Android to display ink surface reaction ripples that respond to the user's touch.
|
||||
- You may consider using [**TouchableNativeFeedback**](docs/touchablenativefeedback.html) on Android to display ink surface reaction ripples that respond to the user's touch.
|
||||
|
||||
- [**TouchableOpacity**](/react-native/docs/touchableopacity.html) can be used to provide feedback by reducing the opacity of the button, allowing the background to be seen through while the user is pressing down.
|
||||
- [**TouchableOpacity**](docs/touchableopacity.html) can be used to provide feedback by reducing the opacity of the button, allowing the background to be seen through while the user is pressing down.
|
||||
|
||||
- If you need to handle a tap gesture but you don't want any feedback to be displayed, use [**TouchableWithoutFeedback**](/react-native/docs/touchablewithoutfeedback.html).
|
||||
- If you need to handle a tap gesture but you don't want any feedback to be displayed, use [**TouchableWithoutFeedback**](docs/touchablewithoutfeedback.html).
|
||||
|
||||
### Long presses
|
||||
|
||||
|
@ -52,11 +52,11 @@ In some cases, you may want to detect when a user presses and holds a view for a
|
|||
|
||||
## Scrolling lists and swiping views
|
||||
|
||||
A common pattern to many mobile apps is the scrollable list of items. Users interact with these using panning or swiping gestures. The [ScrollView](/react-native/docs/using-a-scrollview.html) component displays a list of items that can be scrolled using these gestures.
|
||||
A common pattern to many mobile apps is the scrollable list of items. Users interact with these using panning or swiping gestures. The [ScrollView](docs/using-a-scrollview.html) component displays a list of items that can be scrolled using these gestures.
|
||||
|
||||
ScrollViews can scroll vertically or horizontally, and can be configured to allow paging through views using swiping gestures by using the `pagingEnabled` props. Swiping horizontally between views can also be implemented on Android using the [ViewPagerAndroid](/react-native/docs/viewpagerandroid.html) component.
|
||||
ScrollViews can scroll vertically or horizontally, and can be configured to allow paging through views using swiping gestures by using the `pagingEnabled` props. Swiping horizontally between views can also be implemented on Android using the [ViewPagerAndroid](docs/viewpagerandroid.html) component.
|
||||
|
||||
A [ListView](/react-native/docs/using-a-listview.html) is a special kind of ScrollView that is best suited for displaying long vertical lists of items. It can also display section headers and footers, similar to `UITableView`s on iOS.
|
||||
A [ListView](docs/using-a-listview.html) is a special kind of ScrollView that is best suited for displaying long vertical lists of items. It can also display section headers and footers, similar to `UITableView`s on iOS.
|
||||
|
||||
### Pinch-to-zoom
|
||||
|
||||
|
@ -64,4 +64,4 @@ A ScrollView with a single item can be used to allow the user to zoom content. S
|
|||
|
||||
## Handling additional gestures
|
||||
|
||||
If you want to allow a user to drag a view around the screen, or you want to implement your own custom pan/drag gesture, take a look at the [PanResponder](/react-native/docs/panresponder.html) API or the [gesture responder system docs](/react-native/docs/gesture-responder-system.html).
|
||||
If you want to allow a user to drag a view around the screen, or you want to implement your own custom pan/drag gesture, take a look at the [PanResponder](docs/panresponder.html) API or the [gesture responder system docs](docs/gesture-responder-system.html).
|
||||
|
|
|
@ -63,4 +63,4 @@ class FlexDimensionsBasics extends Component {
|
|||
AppRegistry.registerComponent('AwesomeProject', () => FlexDimensionsBasics);
|
||||
```
|
||||
|
||||
After you can control a component's size, the next step is to [learn how to lay it out on the screen](/react-native/docs/flexbox.html).
|
||||
After you can control a component's size, the next step is to [learn how to lay it out on the screen](docs/flexbox.html).
|
||||
|
|
|
@ -78,7 +78,7 @@ This approach provides no safety checks. It's up to you to guarantee that those
|
|||
|
||||
## Network Images
|
||||
|
||||
Many of the images you will display in your app will not be available at compile time, or you will want to load some dynamically to keep the binary size down. Unlike with static resources, *you will need to manually specify the dimensions of your image*. It's highly recommended that you use https as well in order to satisfy [App Transport Security](/react-native/docs/running-on-device.html#app-transport-security) requirements on iOS.
|
||||
Many of the images you will display in your app will not be available at compile time, or you will want to load some dynamically to keep the binary size down. Unlike with static resources, *you will need to manually specify the dimensions of your image*. It's highly recommended that you use https as well in order to satisfy [App Transport Security](docs/running-on-device.html#app-transport-security) requirements on iOS.
|
||||
|
||||
```javascript
|
||||
// GOOD
|
||||
|
|
|
@ -57,7 +57,7 @@ The keys to integrating React Native components into your iOS application are to
|
|||
5. Start the React Native server and run your native application.
|
||||
6. Optionally add more React Native components.
|
||||
7. [Debug](/react-native/releases/next/docs/debugging.html).
|
||||
8. Prepare for [deployment](/react-native/docs/running-on-device.html) (e.g., via the `react-native-xcode.sh` script).
|
||||
8. Prepare for [deployment](docs/running-on-device.html) (e.g., via the `react-native-xcode.sh` script).
|
||||
9. Deploy and Profit!
|
||||
|
||||
<block class="android" />
|
||||
|
@ -72,7 +72,7 @@ The keys to integrating React Native components into your Android application ar
|
|||
5. Start the React Native server and run your native application.
|
||||
6. Optionally add more React Native components.
|
||||
7. [Debug](/react-native/releases/next/docs/debugging.html).
|
||||
8. [Prepare](/react-native/releases/next/docs/signed-apk-android.html) for [deployment](/react-native/docs/running-on-device.html).
|
||||
8. [Prepare](/react-native/releases/next/docs/signed-apk-android.html) for [deployment](docs/running-on-device.html).
|
||||
9. Deploy and Profit!
|
||||
|
||||
<block class="objc swift android" />
|
||||
|
@ -81,7 +81,7 @@ The keys to integrating React Native components into your Android application ar
|
|||
|
||||
<block class="android" />
|
||||
|
||||
The [Android Getting Started guide](/react-native/docs/getting-started.html) will install the appropriate prerequisites (e.g., `npm`) for React Native on the Android target platform and your chosen development environment.
|
||||
The [Android Getting Started guide](docs/getting-started.html) will install the appropriate prerequisites (e.g., `npm`) for React Native on the Android target platform and your chosen development environment.
|
||||
|
||||
> To ensure a smooth experience, make sure your `android` project is under `$root/android`.
|
||||
|
||||
|
@ -89,7 +89,7 @@ The [Android Getting Started guide](/react-native/docs/getting-started.html) wil
|
|||
|
||||
### General
|
||||
|
||||
First, follow the [Getting Started guide](/react-native/docs/getting-started.html) for your development environment and the iOS target platform to install the prerequisites for React Native.
|
||||
First, follow the [Getting Started guide](docs/getting-started.html) for your development environment and the iOS target platform to install the prerequisites for React Native.
|
||||
|
||||
> To ensure a smooth experience, make sure your `iOS` project is under `$root/ios`.
|
||||
|
||||
|
|
|
@ -65,9 +65,9 @@ Browser
|
|||
|
||||
* [console.{log, warn, error, info, trace, table}](https://developer.chrome.com/devtools/docs/console-api)
|
||||
* [CommonJS require](https://nodejs.org/docs/latest/api/modules.html)
|
||||
* [XMLHttpRequest, fetch](/react-native/docs/network.html#content)
|
||||
* [{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame](/react-native/docs/timers.html#content)
|
||||
* [navigator.geolocation](/react-native/docs/geolocation.html#content)
|
||||
* [XMLHttpRequest, fetch](docs/network.html#content)
|
||||
* [{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame](docs/timers.html#content)
|
||||
* [navigator.geolocation](docs/geolocation.html#content)
|
||||
|
||||
ES6
|
||||
|
||||
|
|
|
@ -104,4 +104,4 @@ AppRegistry.registerComponent('AwesomeProject', () => AlignItemsBasics);
|
|||
|
||||
We've covered the basics, but there are many other styles you may need for layouts. The full list of props that control layout is documented [here](./docs/layout-props.html).
|
||||
|
||||
We're getting close to being able to build a real application. One thing we are still missing is a way to take user input, so let's move on to [learn how to handle text input with the TextInput component](/react-native/docs/handling-text-input.html).
|
||||
We're getting close to being able to build a real application. One thing we are still missing is a way to take user input, so let's move on to [learn how to handle text input with the TextInput component](docs/handling-text-input.html).
|
||||
|
|
|
@ -75,7 +75,7 @@ You can also use the proposed ES2017 `async`/`await` syntax in a React Native ap
|
|||
|
||||
Don't forget to catch any errors that may be thrown by `fetch`, otherwise they will be dropped silently.
|
||||
|
||||
> By default, iOS will block any request that's not encrypted using SSL. If you need to fetch from a cleartext URL (one that begins with `http`) you will first need to add an App Transport Security exception. If you know ahead of time what domains you will need access to, it is more secure to add exceptions just for those domains; if the domains are not known until runtime you can [disable ATS completely](/react-native/docs/integration-with-existing-apps.html#app-transport-security). Note however that from January 2017, [Apple's App Store review will require reasonable justification for disabling ATS](https://forums.developer.apple.com/thread/48979). See [Apple's documentation](https://developer.apple.com/library/ios/documentation/General/Reference/InfoPlistKeyReference/Articles/CocoaKeys.html#//apple_ref/doc/uid/TP40009251-SW33) for more information.
|
||||
> By default, iOS will block any request that's not encrypted using SSL. If you need to fetch from a cleartext URL (one that begins with `http`) you will first need to add an App Transport Security exception. If you know ahead of time what domains you will need access to, it is more secure to add exceptions just for those domains; if the domains are not known until runtime you can [disable ATS completely](docs/integration-with-existing-apps.html#app-transport-security). Note however that from January 2017, [Apple's App Store review will require reasonable justification for disabling ATS](https://forums.developer.apple.com/thread/48979). See [Apple's documentation](https://developer.apple.com/library/ios/documentation/General/Reference/InfoPlistKeyReference/Articles/CocoaKeys.html#//apple_ref/doc/uid/TP40009251-SW33) for more information.
|
||||
|
||||
### Using Other Networking Libraries
|
||||
|
||||
|
@ -130,4 +130,4 @@ ws.onclose = (e) => {
|
|||
};
|
||||
```
|
||||
|
||||
Your app can now display all sorts of data and you may soon need to organize this content into several screens. To manage the transition between these screens, you will need to learn about [navigators](/react-native/docs/using-navigators.html).
|
||||
Your app can now display all sorts of data and you may soon need to organize this content into several screens. To manage the transition between these screens, you will need to learn about [navigators](docs/using-navigators.html).
|
||||
|
|
|
@ -66,8 +66,8 @@ AppRegistry.registerComponent('LotsOfGreetings', () => LotsOfGreetings);
|
|||
|
||||
Using `name` as a prop lets us customize the `Greeting` component, so we can reuse that component for each of our greetings. This example also uses the `Greeting` component in JSX, just like the built-in components. The power to do this is what makes React so cool - if you find yourself wishing that you had a different set of UI primitives to work with, you just invent new ones.
|
||||
|
||||
The other new thing going on here is the [`View`](/react-native/docs/view.html) component. A [`View`](/react-native/docs/view.html) is useful
|
||||
The other new thing going on here is the [`View`](docs/view.html) component. A [`View`](docs/view.html) is useful
|
||||
as a container for other components, to help control style and layout.
|
||||
|
||||
With `props` and the basic [`Text`](/react-native/docs/text.html), [`Image`](/react-native/docs/image.html), and [`View`](/react-native/docs/view.html) components, you can
|
||||
build a wide variety of static screens. To learn how to make your app change over time, you need to [learn about State](/react-native/docs/state.html).
|
||||
With `props` and the basic [`Text`](docs/text.html), [`Image`](docs/image.html), and [`View`](docs/view.html) components, you can
|
||||
build a wide variety of static screens. To learn how to make your app change over time, you need to [learn about State](docs/state.html).
|
||||
|
|
|
@ -157,7 +157,7 @@ $ react-native run-android
|
|||
|
||||
<block class="mac ios" />
|
||||
|
||||
You can also iterate quickly on a device using the development server. You only have to be on the same Wi-Fi network as your computer. Shake the device to open the [Developer menu](/react-native/docs/debugging.html#accessing-the-in-app-developer-menu).
|
||||
You can also iterate quickly on a device using the development server. You only have to be on the same Wi-Fi network as your computer. Shake the device to open the [Developer menu](docs/debugging.html#accessing-the-in-app-developer-menu).
|
||||
|
||||
<block class="mac windows linux android" />
|
||||
|
||||
|
@ -200,8 +200,8 @@ Open a terminal and type `/sbin/ifconfig` to find your machine's IP address.
|
|||
|
||||
1. Make sure your laptop and your phone are on the **same** Wi-Fi network.
|
||||
2. Open your React Native app on your device.
|
||||
3. You'll see a [red screen with an error](/react-native/docs/debugging.html#in-app-errors-and-warnings). This is OK. The following steps will fix that.
|
||||
4. Open the in-app [Developer menu](/react-native/docs/debugging.html#accessing-the-in-app-developer-menu).
|
||||
3. You'll see a [red screen with an error](docs/debugging.html#in-app-errors-and-warnings). This is OK. The following steps will fix that.
|
||||
4. Open the in-app [Developer menu](docs/debugging.html#accessing-the-in-app-developer-menu).
|
||||
5. Go to **Dev Settings** → **Debug server host for device**.
|
||||
6. Type in your machine's IP address and the port of the local dev server (e.g. 10.0.1.1:8081).
|
||||
7. Go back to the **Developer menu** and select **Reload JS**.
|
||||
|
|
|
@ -57,4 +57,4 @@ In a real application, you probably won't be setting state with a timer. You mig
|
|||
|
||||
State works the same way as it does in React, so for more details on handling state, you can look at the [React.Component API](https://facebook.github.io/react/docs/component-api.html).
|
||||
|
||||
At this point, you might be annoyed that most of our examples so far use boring default black text. To make things more beautiful, you will have to [learn about Style](/react-native/docs/style.html).
|
||||
At this point, you might be annoyed that most of our examples so far use boring default black text. To make things more beautiful, you will have to [learn about Style](docs/style.html).
|
||||
|
|
|
@ -48,6 +48,6 @@ AppRegistry.registerComponent('LotsOfStyles', () => LotsOfStyles);
|
|||
One common pattern is to make your component accept a `style` prop which in
|
||||
turn is used to style subcomponents. You can use this to make styles "cascade" the way they do in CSS.
|
||||
|
||||
There are a lot more ways to customize text style. Check out the [Text component reference](/react-native/docs/text.html) for a complete list.
|
||||
There are a lot more ways to customize text style. Check out the [Text component reference](docs/text.html) for a complete list.
|
||||
|
||||
Now you can make your text beautiful. The next step in becoming a style master is to [learn how to control component size](/react-native/docs/height-and-width.html).
|
||||
Now you can make your text beautiful. The next step in becoming a style master is to [learn how to control component size](docs/height-and-width.html).
|
||||
|
|
|
@ -42,7 +42,7 @@ It's a good idea to add an Android unit test whenever you are working on code th
|
|||
|
||||
## Android Integration Tests
|
||||
|
||||
To run the integration tests, you need to install the Android NDK. See [Prerequisites](/react-native/docs/android-building-from-source.html#prerequisites).
|
||||
To run the integration tests, you need to install the Android NDK. See [Prerequisites](docs/android-building-from-source.html#prerequisites).
|
||||
|
||||
You also need to install the [Buck build tool](https://buckbuild.com/setup/install.html).
|
||||
|
||||
|
|
|
@ -32,7 +32,7 @@ You can configure the packager to use a port other than 8081 by using the `port`
|
|||
$ react-native start --port=8088
|
||||
```
|
||||
|
||||
You will also need to update your applications to load the JavaScript bundle from the new port. Open the in-app [Developer menu](/react-native/docs/debugging.html#accessing-the-in-app-developer-menu), then go to **Dev Settings** → **Debug server host for device** and replace 8081 with your port of choice.
|
||||
You will also need to update your applications to load the JavaScript bundle from the new port. Open the in-app [Developer menu](docs/debugging.html#accessing-the-in-app-developer-menu), then go to **Dev Settings** → **Debug server host for device** and replace 8081 with your port of choice.
|
||||
|
||||
### NPM locking error
|
||||
|
||||
|
|
|
@ -51,4 +51,4 @@ The `AppRegistry` just tells React Native which component is the root one for th
|
|||
|
||||
## This App Doesn't Do Very Much
|
||||
|
||||
Good point. To make components do more interesting things, you need to [learn about Props](/react-native/docs/props.html).
|
||||
Good point. To make components do more interesting things, you need to [learn about Props](docs/props.html).
|
||||
|
|
|
@ -10,7 +10,7 @@ previous: using-a-scrollview
|
|||
|
||||
The `ListView` component displays a vertically scrolling list of changing, but similarly structured, data.
|
||||
|
||||
`ListView` works well for long lists of data, where the number of items might change over time. Unlike the more generic [`ScrollView`](/react-native/docs/using-a-scrollview.html), the `ListView` only renders elements that are currently showing on the screen, not all the elements at once.
|
||||
`ListView` works well for long lists of data, where the number of items might change over time. Unlike the more generic [`ScrollView`](docs/using-a-scrollview.html), the `ListView` only renders elements that are currently showing on the screen, not all the elements at once.
|
||||
|
||||
The `ListView` component requires two props: `dataSource` and `renderRow`. `dataSource` is the source of information for the list. `renderRow` takes one item from the source and returns a formatted component to render.
|
||||
|
||||
|
@ -49,4 +49,4 @@ class ListViewBasics extends Component {
|
|||
AppRegistry.registerComponent('ListViewBasics', () => ListViewBasics);
|
||||
```
|
||||
|
||||
One of the most common uses for a `ListView` is displaying data that you fetch from a server. To do that, you will need to [learn about networking in React Native](/react-native/docs/network.html).
|
||||
One of the most common uses for a `ListView` is displaying data that you fetch from a server. To do that, you will need to [learn about networking in React Native](docs/network.html).
|
||||
|
|
|
@ -8,7 +8,7 @@ next: using-a-listview
|
|||
previous: handling-text-input
|
||||
---
|
||||
|
||||
The [`ScrollView`](/react-native/docs/scrollview.html) is a generic scrolling container that can host multiple components and views. The scrollable items need not be homogenous, and you can scroll both vertically and horizontally (by setting the `horizontal` property).
|
||||
The [`ScrollView`](docs/scrollview.html) is a generic scrolling container that can host multiple components and views. The scrollable items need not be homogenous, and you can scroll both vertically and horizontally (by setting the `horizontal` property).
|
||||
|
||||
This example creates a vertical `ScrollView` with both images and text mixed together.
|
||||
|
||||
|
@ -62,4 +62,4 @@ AppRegistry.registerComponent(
|
|||
() => IScrolledDownAndWhatHappenedNextShockedMe);
|
||||
```
|
||||
|
||||
`ScrollView` works best to present a small amount of things of a limited size. All the elements and views of a `ScrollView` are rendered, even if they are not currently shown on the screen. If you have a long list of more items that can fit on the screen, you should use a `ListView` instead. So let's [learn about the ListView](/react-native/docs/using-a-listview.html) next.
|
||||
`ScrollView` works best to present a small amount of things of a limited size. All the elements and views of a `ScrollView` are rendered, even if they are not currently shown on the screen. If you have a long list of more items that can fit on the screen, you should use a `ListView` instead. So let's [learn about the ListView](docs/using-a-listview.html) next.
|
||||
|
|
|
@ -179,4 +179,4 @@ Check out the [Navigator API reference](docs/navigator.html) for more `Navigator
|
|||
|
||||
## High Five!
|
||||
|
||||
If you've gotten here by reading linearly through the tutorial, then you are a pretty impressive human being. Congratulations. Next, you might want to check out [all the cool stuff the community does with React Native](/react-native/docs/more-resources.html).
|
||||
If you've gotten here by reading linearly through the tutorial, then you are a pretty impressive human being. Congratulations. Next, you might want to check out [all the cool stuff the community does with React Native](docs/more-resources.html).
|
||||
|
|
Loading…
Reference in New Issue