gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix(guide): correct some small typos (#30748)

Browse Source
This commit is contained in:
Eric Hartline
2019-01-18 18:44:26 -06:00
committed by Tom
parent d80b374bc1
commit b96a865a30
1 changed files with 4 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
guide/english/react/higher-order-components/index.md
View File

@ -3,7 +3,7 @@ title: Higher-Order Components
---
## Higher-Order Components
In React, a **Higher-Order Component** (HOC) is a function that takes a component and return a new component. Programmers use HOCs to achieve **component logic reuse**.
In React, a **Higher-Order Component** (HOC) is a function that takes a component and returns a new component. Programmers use HOCs to achieve **component logic reuse**.
If you've used Redux's `connect`, you've already worked with Higher-Order Components.
@ -38,9 +38,9 @@ function enhance(WrappedComponent) {
In this case, `enhance` returns an **anonymous class** that extends `React.Component`. This new component is doing three simple things:
* Rendering the `WrappedComponent` within a `div` element;
* Passing its own props to the `WrappedComponent`; and
* Injecting an extra prop to the `WrappedComponent`.
* Rendering the `WrappedComponent` within a `div` element
* Passing its own props to the `WrappedComponent`
* Injecting an extra prop to the `WrappedComponent`
### Caveats
Higher-order components come with a few caveats that aren’t immediately obvious if you’re new to React.
@ -63,7 +63,6 @@ function enhance(WrappedComponent) {
})
}
```
HOCs are just a pattern that uses the power of React's compositional nature. **They add features to a component**. There are a lot more things you can do with them!
## Other Resources
* [React docs: Higher-Order Components](https://reactjs.org/docs/higher-order-components.html)