Skip to content

Commit d0aa780

Browse files
committed
Format docs content
1 parent cce5d8b commit d0aa780

9 files changed

+413
-404
lines changed

docs/api/Provider.md

Lines changed: 37 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -25,56 +25,54 @@ The single Redux `store` in your application.
2525
`children` (ReactElement)
2626
The root of your component hierarchy.
2727

28-
2928
### Example Usage
3029

3130
In the example below, the `<App />` component is our root-level component. This means it’s at the very top of our component hierarchy.
3231

3332
**Vanilla React Example**
3433

3534
```jsx
36-
import React from 'react';
37-
import ReactDOM from 'react-dom';
38-
import { Provider } from 'react-redux';
39-
40-
import { App } from './App';
41-
import createStore from './createReduxStore';
35+
import React from 'react'
36+
import ReactDOM from 'react-dom'
37+
import { Provider } from 'react-redux'
4238

43-
const store = createStore();
39+
import { App } from './App'
40+
import createStore from './createReduxStore'
4441

45-
ReactDOM.render(
46-
<Provider store={store}>
47-
<App />
48-
</Provider>,
49-
document.getElementById('root')
50-
)
51-
```
42+
const store = createStore()
5243

44+
ReactDOM.render(
45+
<Provider store={store}>
46+
<App />
47+
</Provider>,
48+
document.getElementById('root')
49+
)
50+
```
5351

5452
**Usage with React Router**
5553

5654
```jsx
57-
import React from 'react';
58-
import ReactDOM from 'react-dom';
59-
import { Provider } from 'react-redux';
60-
import { Router, Route } from 'react-router-dom';
61-
62-
import { App } from './App';
63-
import { Foo } from './Foo';
64-
import { Bar } from './Bar';
65-
import createStore from './createReduxStore';
66-
67-
const store = createStore();
68-
69-
ReactDOM.render(
70-
<Provider store={store}>
71-
<Router history={history}>
72-
<Route path="/" component={App}>
73-
<Route path="foo" component={Foo}/>
74-
<Route path="bar" component={Bar}/>
75-
</Route>
76-
</Router>
77-
</Provider>,
78-
document.getElementById('root')
79-
)
80-
```
55+
import React from 'react'
56+
import ReactDOM from 'react-dom'
57+
import { Provider } from 'react-redux'
58+
import { Router, Route } from 'react-router-dom'
59+
60+
import { App } from './App'
61+
import { Foo } from './Foo'
62+
import { Bar } from './Bar'
63+
import createStore from './createReduxStore'
64+
65+
const store = createStore()
66+
67+
ReactDOM.render(
68+
<Provider store={store}>
69+
<Router history={history}>
70+
<Route path="/" component={App}>
71+
<Route path="foo" component={Foo} />
72+
<Route path="bar" component={Bar} />
73+
</Route>
74+
</Router>
75+
</Provider>,
76+
document.getElementById('root')
77+
)
78+
```

docs/api/connect-advanced.md

Lines changed: 17 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -13,29 +13,29 @@ connectAdvanced(selectorFactory, connectOptions?)
1313
1414
Connects a React component to a Redux store. It is the base for `connect()` but is less opinionated about how to combine `state`, `props`, and `dispatch` into your final props. It makes no assumptions about defaults or memoization of results, leaving those responsibilities to the caller.
1515
16-
It does not modify the component class passed to it; instead, it *returns* a new, connected component class for you to use.
16+
It does not modify the component class passed to it; instead, it _returns_ a new, connected component class for you to use.
1717
1818
Most applications will not need to use this, as the default behavior in `connect` is intended to work for most use cases.
1919
20-
> Note: `connectAdvanced` was added in version 5.0, and `connect` was reimplemented as a specific set of parameters to `connectAdvanced`.
20+
> Note: `connectAdvanced` was added in version 5.0, and `connect` was reimplemented as a specific set of parameters to `connectAdvanced`.
2121
2222
## Arguments
2323
24-
* `selectorFactory(dispatch, factoryOptions): selector(state, ownProps): props` \(*Function*): Initializes a selector function (during each instance's constructor). That selector function is called any time the connector component needs to compute new props, as a result of a store state change or receiving new props. The result of `selector` is expected to be a plain object, which is passed as the props to the wrapped component. If a consecutive call to `selector` returns the same object (`===`) as its previous call, the component will not be re-rendered. It's the responsibility of `selector` to return that previous object when appropriate.
24+
- `selectorFactory(dispatch, factoryOptions): selector(state, ownProps): props` \(_Function_): Initializes a selector function (during each instance's constructor). That selector function is called any time the connector component needs to compute new props, as a result of a store state change or receiving new props. The result of `selector` is expected to be a plain object, which is passed as the props to the wrapped component. If a consecutive call to `selector` returns the same object (`===`) as its previous call, the component will not be re-rendered. It's the responsibility of `selector` to return that previous object when appropriate.
2525
26-
* [`connectOptions`] *(Object)* If specified, further customizes the behavior of the connector.
26+
- [`connectOptions`] _(Object)_ If specified, further customizes the behavior of the connector.
2727
28-
* [`getDisplayName`] *(Function)*: computes the connector component's displayName property relative to that of the wrapped component. Usually overridden by wrapper functions. Default value: `name => 'ConnectAdvanced('+name+')'`
28+
- [`getDisplayName`] _(Function)_: computes the connector component's displayName property relative to that of the wrapped component. Usually overridden by wrapper functions. Default value: `name => 'ConnectAdvanced('+name+')'`
2929
30-
* [`methodName`] *(String)*: shown in error messages. Usually overridden by wrapper functions. Default value: `'connectAdvanced'`
30+
- [`methodName`] _(String)_: shown in error messages. Usually overridden by wrapper functions. Default value: `'connectAdvanced'`
3131
32-
* [`renderCountProp`] *(String)*: if defined, a property named this value will be added to the props passed to the wrapped component. Its value will be the number of times the component has been rendered, which can be useful for tracking down unnecessary re-renders. Default value: `undefined`
32+
- [`renderCountProp`] _(String)_: if defined, a property named this value will be added to the props passed to the wrapped component. Its value will be the number of times the component has been rendered, which can be useful for tracking down unnecessary re-renders. Default value: `undefined`
3333
34-
* [`shouldHandleStateChanges`] *(Boolean)*: controls whether the connector component subscribes to redux store state changes. If set to false, it will only re-render when parent component re-renders. Default value: `true`
34+
- [`shouldHandleStateChanges`] _(Boolean)_: controls whether the connector component subscribes to redux store state changes. If set to false, it will only re-render when parent component re-renders. Default value: `true`
3535
36-
* [`forwardRef`] *(Boolean)*: If true, adding a ref to the connected wrapper component will actually return the instance of the wrapped component.
36+
- [`forwardRef`] _(Boolean)_: If true, adding a ref to the connected wrapper component will actually return the instance of the wrapped component.
3737
38-
* Additionally, any extra options passed via `connectOptions` will be passed through to your `selectorFactory` in the `factoryOptions` argument.
38+
- Additionally, any extra options passed via `connectOptions` will be passed through to your `selectorFactory` in the `factoryOptions` argument.
3939
4040
<a id="connectAdvanced-returns"></a>
4141
@@ -45,21 +45,20 @@ A higher-order React component class that builds props from the store state and
4545
4646
### Static Properties
4747
48-
* `WrappedComponent` *(Component)*: The original component class passed to `connectAdvanced(...)(Component)`.
48+
- `WrappedComponent` _(Component)_: The original component class passed to `connectAdvanced(...)(Component)`.
4949
5050
### Static Methods
5151
5252
All the original static methods of the component are hoisted.
5353
54-
55-
5654
## Remarks
5755
58-
* Since `connectAdvanced` returns a higher-order component, it needs to be invoked two times. The first time with its arguments as described above, and a second time, with the component: `connectAdvanced(selectorFactory)(MyComponent)`.
56+
- Since `connectAdvanced` returns a higher-order component, it needs to be invoked two times. The first time with its arguments as described above, and a second time, with the component: `connectAdvanced(selectorFactory)(MyComponent)`.
5957
60-
* `connectAdvanced` does not modify the passed React component. It returns a new, connected component, that you should use instead.
58+
- `connectAdvanced` does not modify the passed React component. It returns a new, connected component, that you should use instead.
6159
6260
<a id="connectAdvanced-examples"></a>
61+
6362
### Examples
6463
6564
### Inject `todos` of a specific user depending on props, and inject `props.userId` into the action
@@ -71,10 +70,10 @@ import { bindActionCreators } from 'redux'
7170
function selectorFactory(dispatch) {
7271
let ownProps = {}
7372
let result = {}
74-
73+
7574
const actions = bindActionCreators(actionCreators, dispatch)
76-
const addTodo = (text) => actions.addTodo(ownProps.userId, text)
77-
75+
const addTodo = text => actions.addTodo(ownProps.userId, text)
76+
7877
return (nextState, nextOwnProps) => {
7978
const todos = nextState.todos[nextOwnProps.userId]
8079
const nextResult = { ...nextOwnProps, todos, addTodo }
@@ -85,4 +84,3 @@ function selectorFactory(dispatch) {
8584
}
8685
export default connectAdvanced(selectorFactory)(TodoApp)
8786
```
88-

0 commit comments

Comments
 (0)