Question

在https://redux.js.org/basics/exampletodolist#containers-filterlink-js中， FilterLink.js 的代码为

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)

我们可以明显地看到，活动和 onClick 已传递给链接组件

但是，在链接组件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

链接道具中的孩子来自哪里？

Answer 1

组件中的所有子元素都是子元素：

SortedMap

这就是反应道具传递的方式。

Redux官方todo示例中的mapStateToProps中的Children在哪里？

1 个答案: