Где находится дочерние элементы mapStateToProps в официальном примере todo?

Question

in https://redux.js.org/basics/exampletodolist#containers-filterlink-js, код FilterLink.js is

import { connect } from 'react-redux'
import { setVisibilityFilter } from '../actions'
import Link from '../components/Link'
​
const mapStateToProps = (state, ownProps) => ({
  active: ownProps.filter === state.visibilityFilter
})
​
const mapDispatchToProps = (dispatch, ownProps) => ({
  onClick: () => dispatch(setVisibilityFilter(ownProps.filter))
})
​
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(Link)

Мы можем найти, очевидно, active и onClick передается в компонент Link

Однако в компоненте Link https://redux.js.org/basics/exampletodolist#components-link-js, код

import React from 'react'
import PropTypes from 'prop-types'
​
const Link = ({ active, children, onClick }) => (
  <button
    onClick={onClick}
    disabled={active}
    style={{
      marginLeft: '4px'
    }}
  >
    {children}
  </button>
)
​
Link.propTypes = {
  active: PropTypes.bool.isRequired,
  children: PropTypes.node.isRequired,
  onClick: PropTypes.func.isRequired
}
​
export default Link

Где children in Ссылка реквизиты берутся?

Answer 1

Все, что находится внутри компонента, является дочерним:

<Link>
I am children
</Link>


props.children // I am children


<MyComponent>
  <div>
   <h1>The root div element is called children here 
     which can contain several elements and/or components.</h1>
  </div>
</MyComponent>


<MainComponent>
  <ChildComponent /> {/* children to MainComponent */}
</MainComponent>

Это просто то, как реагирует реквизит.