Question

我是Redux的新手，所以我可能在某个地方错过了这部分。我有一个React.Component和一个带有动作START和STOP的redux-saga存储。我正在做的事情是将Component的状态作为有效负载发送，以将其保留在redux存储中，但是我的方法不起作用

let PAYLOAD = {}

class App extends Component {
  constructor(props) {
    super(props)
    this.state = {
      data: [],
    }
  }

  /* some functions */

  render() {
    const { data } = this.state

    PAYLOAD = data
    return (
      <div />
    )
  }
}

function action(type, payload = {}) {
  return { type, ...payload }
}

export const START = () => action('START', PAYLOAD)
export const STOP = () => action('STOP', PAYLOAD)

const mapStateToProps = state => ({
  data: state.data,
})

const mapDispatchToProps = {
  start: START,
  stop: STOP,
}

export default connect(mapStateToProps, mapDispatchToProps)(App)

我得到的是[]在减速器中初始化的

Answer 1

丢失初始的let语句。这样定义意味着您将始终只发送初始值，因为这是定义动作创建者功能时的值。

您应该定义动作创建者，以便他们可以接收参数：

export const START = payload => action('START', payload)
export const STOP = payload => action('STOP', payload)

您的mapDispatchToProps随后会将这些函数传递到组件的道具上，因此您可以调用它们：

  render() {
    const { data } = this.state
    const { start, stop } = this.props

    start(data)
    stop(data)
    return (
      <div />
    )
  }

请记住，此示例在每个渲染上同时调用开始和停止，请确保仅在需要时才调用它们。

如何发送组件状态作为有效载荷进行存储

1 个答案: