如何将 props 数据传递给 compose()

Posted 2023-02-22

【中文标题】如何将 props 数据传递给 compose()

【英文标题】：How to pass props data to compose()

【发布时间】：2019-12-02 16:43:11

【问题描述】：

我有使用 firebase 并连接到商店的 Messages 组件， 现在我正在努力解决如何设置 queryParams:limitToLast 动态，从道具传递数据不起作用..有什么想法吗？

我收到的错误是： TypeError：无法读取未定义的属性“道具”

import React,  Component  from 'react'
    import  compose  from 'redux'
    import  connect  from 'react-redux'
    import  firebaseConnect  from 'react-redux-firebase'
    import PropTypes from 'prop-types'

    class Messages extends Component 
      render() 
        return (
          <div>
            this.props.active ? (
              this.props.message.map(x => console.log(x))
            ) : (
              <span>Loading</span>
            )
          </div>
        )
      
    
    // Checks prop type and outputs to console if type not matched..
    Messages.propTypes = 
      Messages: PropTypes.array
    


    export default compose(
      firebaseConnect([
        
          path: 'message',
          queryParams: ['limitToLast=' this.props.count]
        
      ]),
      //connect to redux store
      connect(( firebase:  ordered, profile  ) => (
        message: ordered.message,
        uid: profile.uid
      ))
    )(Messages)

【参考方案1】：

正如docs 中提到的，您可以像这样访问道具：

firebaseConnect(props => 
// Set listeners based on props (prop is route parameter from react-router in this case)
return [
   path: `todos/$props.params.todoId`  // create todo listener
  // `todos/$props.params.todoId` // equivalent string notation
]

),

【参考方案2】：

希望以下代码对您有所帮助：

import  compose  from 'redux' 
import  connect  from 'react-redux'
import  firestoreConnect  from 'react-redux-firebase'

export default compose(
  firestoreConnect((props) => [
     collection: 'todos', doc: props.todoId  // or `todos/$props.todoId`
  ]),

  connect(( firestore:  data  , props) => (
    todos: data.todos && data.todos[todoId]
  ))
)(SomeComponent)