redux tutorial : Where does children come from

This question already has an answer here:

children prop in React component 2 answers

---

In React you may have two types of components. A class that extends React.Component or a functional component which is just a vanilla JavaScript function. The functional components also receives props similarly to the class where we use this.props (or receive them as first argument of the constructor. For example:

import React from 'react';

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    const { name } = this.props;

    return <p>Hello { name }</p>;
  }
}

<MyComponent name='Jon Snow' />

Or as functional component:

function MyComponent(props) {
  const { name } = props;

  return <p>Hello { name }</p>;
}

The confusion in your case comes from the fact that there is a destructing of the props directly in the function definition. So MyComponent above may be written like:

function MyComponent({ name }) {
  return <p>Hello { name }</p>;
}

The children prop in React represents what's added as child elements of the component. For example:

<MyComponent>
  <Name />
</MyComponent>

or even

<MyComponent>
  { () => <p>Hello world</p> }
</MyComponent>

<Name /> and () => <p>Hello world</p> is what props.children is equal to.

In your example children will be what's put inside FilterLink . For example:

<FilterLink>
  <VisibleOnlyIfActiveIsTruethy />
</FilterLink>

---

The children prop is coming from the components that could be inside(wrapped by) the Link component when you call it, example:

<Parent>
 <Comp1 />
 <Comp2 />
</Parent>

in this code: Comp1 and Comp2 are children of the Parent component.

链接地址: http://www.djcxy.com/p/52168.html

上一篇: 使用反应时呈现的组件上的Typescript错误

下一篇: REDX教程：儿童从哪里来