Browse Source

Standardized Markdown lists

main
Paul O’Shannessy 12 years ago
parent
commit
225abe1ec8
  1. 22
      docs/02.1-jsx-in-depth.md
  2. 12
      docs/06-forms.md
  3. 26
      docs/07-working-with-the-browser.md

22
docs/02.1-jsx-in-depth.md

@ -22,9 +22,9 @@ var link = React.DOM.a({href: 'http://facebook.github.io/react'}, 'React');
We recommend using JSX for many reasons: We recommend using JSX for many reasons:
- It's easier to visualize the structure of the DOM. * It's easier to visualize the structure of the DOM.
- Designers are more comfortable making changes. * Designers are more comfortable making changes.
- It's familiar for those who have used MXML or XAML. * It's familiar for those who have used MXML or XAML.
## The Transform ## The Transform
@ -69,8 +69,8 @@ how to setup compilation.
React and JSX are independent technologies, but JSX was primarily built with React and JSX are independent technologies, but JSX was primarily built with
React in mind. The two valid uses of JSX are: React in mind. The two valid uses of JSX are:
- To construct instances of React DOM components (`React.DOM.*`). * To construct instances of React DOM components (`React.DOM.*`).
- To construct instances of composite components created with * To construct instances of composite components created with
`React.createClass()`. `React.createClass()`.
### React DOM Components ### React DOM Components
@ -160,9 +160,9 @@ var content = <Container>{/* this is a comment */}<Nav /></Container>;
Beyond the compilation step, JSX does not require any special tools. Beyond the compilation step, JSX does not require any special tools.
- Many editors already include reasonable support for JSX (Vim, Emacs js2-mode). * Many editors already include reasonable support for JSX (Vim, Emacs js2-mode).
- Linting provides accurate line numbers after compiling without sourcemaps. * Linting provides accurate line numbers after compiling without sourcemaps.
- Elements use standard scoping so linters can find usage of out-of-scope * Elements use standard scoping so linters can find usage of out-of-scope
components. components.
## Prior Work ## Prior Work
@ -171,8 +171,8 @@ JSX is similar to several other JavaScript embedded XML language
proposals/projects. Some of the features of JSX that distinguish it from similar proposals/projects. Some of the features of JSX that distinguish it from similar
efforts include: efforts include:
- JSX is a simple syntactic transform. * JSX is a simple syntactic transform.
- JSX neither provides nor requires a runtime library. * JSX neither provides nor requires a runtime library.
- JSX does not alter or add to the semantics of JavaScript. * JSX does not alter or add to the semantics of JavaScript.
JSX is similar to HTML, but not exactly the same. See [JSX gotchas](./jsx-gotchas.html) for some key differences. JSX is similar to HTML, but not exactly the same. See [JSX gotchas](./jsx-gotchas.html) for some key differences.

12
docs/06-forms.md

@ -14,17 +14,17 @@ Form components such as `<input>`, `<textarea>`, and `<option>` differ from othe
Form components support a few props that are affected via user interactions: Form components support a few props that are affected via user interactions:
- `value`, supported by `<input>` and `<textarea>` components. * `value`, supported by `<input>` and `<textarea>` components.
- `checked`, supported by `<input>` components of type `checkbox` or `radio`. * `checked`, supported by `<input>` components of type `checkbox` or `radio`.
- `selected`, supported by `<option>` components. * `selected`, supported by `<option>` components.
In HTML, the value of `<textarea>` is set via children. In React, you should use `value` instead. In HTML, the value of `<textarea>` is set via children. In React, you should use `value` instead.
Form components allow listening for changes by setting a callback to the `onChange` prop. The `onChange` prop works across browsers to fire in response to user interactions when: Form components allow listening for changes by setting a callback to the `onChange` prop. The `onChange` prop works across browsers to fire in response to user interactions when:
- The `value` of `<input>` or `<textarea>` changes. * The `value` of `<input>` or `<textarea>` changes.
- The `checked` state of `<input>` changes. * The `checked` state of `<input>` changes.
- The `selected` state of `<option>` changes. * The `selected` state of `<option>` changes.
Like all DOM events, the `onChange` prop is supported on all native components and can be used to listen to bubbled change events. Like all DOM events, the `onChange` prop is supported on all native components and can be used to listen to bubbled change events.

26
docs/07-working-with-the-browser.md

@ -69,39 +69,39 @@ To learn more about refs, including ways to use them effectively, see our [more
Components have three main parts of their lifecycle: Components have three main parts of their lifecycle:
- **Mounting:** A component is being inserted into the DOM. * **Mounting:** A component is being inserted into the DOM.
- **Updating:** A component is being re-rendered to determine if the DOM should be updated. * **Updating:** A component is being re-rendered to determine if the DOM should be updated.
- **Unmounting:** A component is being removed from the DOM. * **Unmounting:** A component is being removed from the DOM.
React provides lifecycle methods that you can specify to hook into this process. We provide **will** methods, which are called right before something happens, and **did** methods which are called right after something happens. React provides lifecycle methods that you can specify to hook into this process. We provide **will** methods, which are called right before something happens, and **did** methods which are called right after something happens.
### Mounting ### Mounting
- `getInitialState(): object` is invoked before a component is mounted. Stateful components should implement this and return the initial state data. * `getInitialState(): object` is invoked before a component is mounted. Stateful components should implement this and return the initial state data.
- `componentWillMount()` is invoked immediately before mounting occurs. * `componentWillMount()` is invoked immediately before mounting occurs.
- `componentDidMount(DOMElement rootNode)` is invoked immediately after mounting occurs. Initialization that requires DOM nodes should go here. * `componentDidMount(DOMElement rootNode)` is invoked immediately after mounting occurs. Initialization that requires DOM nodes should go here.
### Updating ### Updating
- `componentWillReceiveProps(object nextProps)` is invoked when a mounted component receives new props. This method should be used to compare `this.props` and `nextProps` to perform state transitions using `this.setState()`. * `componentWillReceiveProps(object nextProps)` is invoked when a mounted component receives new props. This method should be used to compare `this.props` and `nextProps` to perform state transitions using `this.setState()`.
- `shouldComponentUpdate(object nextProps, object nextState): boolean` is invoked when a component decides whether any changes warrant an update to the DOM. Implement this as an optimization to compare `this.props` with `nextProps` and `this.state` with `nextState` and return false if React should skip updating. * `shouldComponentUpdate(object nextProps, object nextState): boolean` is invoked when a component decides whether any changes warrant an update to the DOM. Implement this as an optimization to compare `this.props` with `nextProps` and `this.state` with `nextState` and return false if React should skip updating.
- `componentWillUpdate(object nextProps, object nextState)` is invoked immediately before updating occurs. You cannot call `this.setState()` here. * `componentWillUpdate(object nextProps, object nextState)` is invoked immediately before updating occurs. You cannot call `this.setState()` here.
- `componentDidUpdate(object prevProps, object prevState, DOMElement rootNode)` is invoked immediately after updating occurs. * `componentDidUpdate(object prevProps, object prevState, DOMElement rootNode)` is invoked immediately after updating occurs.
### Unmounting ### Unmounting
- `componentWillUnmount()` is invoked immediately before a component is unmounted and destroyed. Cleanup should go here. * `componentWillUnmount()` is invoked immediately before a component is unmounted and destroyed. Cleanup should go here.
### Mounted Methods ### Mounted Methods
_Mounted_ composite components also support the following methods: _Mounted_ composite components also support the following methods:
- `getDOMNode(): DOMElement` can be invoked on any mounted component in order to obtain a reference to its rendered DOM node. * `getDOMNode(): DOMElement` can be invoked on any mounted component in order to obtain a reference to its rendered DOM node.
- `forceUpdate()` can be invoked on any mounted component when you know that some deeper aspect of the component's state has changed without using `this.setState()`. * `forceUpdate()` can be invoked on any mounted component when you know that some deeper aspect of the component's state has changed without using `this.setState()`.
> Note: > Note:
> >

Loading…
Cancel
Save