如何在没有map的情况下连接工作DispatchToProps

我正在阅读redux的示例文档，并且我找到了容器组件的示例。有人可以解释为什么在这种情况下mapDispatchToProps不需要在这里。另外，函数如何获得调度功能？如何在没有map的情况下连接工作DispatchToProps

import React from 'react' 
import { connect } from 'react-redux' 
import { addTodo } from '../actions' 

let AddTodo = ({ dispatch }) => { 
let input 

return (
    <div> 
     <form onSubmit={e => { 
     e.preventDefault() 
     if (!input.value.trim()) { 
      return 
     } 
     dispatch(addTodo(input.value)) 
     input.value = '' 
     }}> 
     <input ref={node => { 
      input = node 
     }} /> 
     <button type="submit"> 
      Add Todo 
     </button> 
     </form> 
    </div> 
) 
} 
AddTodo = connect()(AddTodo) 

export default AddTodo

来源

2017-01-16 Nate

connect()(AddTodo)将通过dispatch作为prop to AddTodo组件，即使没有状态或预定义的操作，该组件仍然有用。这就是您的代码中不需要mapDispatchToProps的原因

现在在您的组件let AddTodo = ({ dispatch }) => {中，您正在解构您的道具以仅访问dispatch。

如果您使用mapDispatchToProps，您将使您的addTodo动作可作为组件的道具使用，然后将其称为this.props.addTodo。所以上述方法是一种选择。这取决于你选择什么你感觉舒服与

connect只是通过store/dispatch通过React上下文，所以你不必通过许多组件通过商店。你不必使用连接。任何模块/ HOC模式都可以工作，连接恰好是一个方便的使用方法。

在组件中使用dispatch或使用mapDispatchToProps是同一件事。

但是使用mapDispatchToProps可以让您更灵活地构建代码并将所有动作创建者放在同一个位置。

作为每docs：

[mapDispatchToProps（调度，[ownProps]）：dispatchProps]（对象或函数）：

如果对象被传递，每个它内部的函数被假定为Redux动作创建者。一个具有相同函数名称的对象，但每个动作创建者都被包装成一个调度调用，因此它们可以直接调用，将被合并到组件的道具中。

如果一个函数通过，它将被作为第一个参数发送。这取决于你返回一个对象，以某种方式使用调度以自己的方式绑定动作创建者。（提示：你可以使用的bindActionCreators()助手从终极版）

如果您mapDispatchToProps函数声明为采用两个参数，它将派遣传递给所连接的组件作为第一个参数和道具被称为第二个参数，并且只要连接的组件收到新的道具，就会被重新调用。（第二个参数通常由惯例被称为ownProps。）

如果你不提供自己的mapDispatchToProps功能或对象全面的行动创造者，默认mapDispatchToProps 实现只是注入派遣到组件的道具。

来源

2017-01-16 07:02:28

人们倾向于用两种方式写react。一种是你通常会遇到的基于class的方法。它基本上使用类。

class App extends Component{ 
    constructor(){ 
     super(); 
     this.state={} 
    } 
    render(){ 
     return(

      // 
     ); 
    } 
}

和其他是functional approach。

const App = (props) => { 
 
    return(
     <div><h2>{{props.name}}</h2></div> 
    ) 
}

所以，在功能性方法，您可以通过数据arguments到您的组件。因此，如果您已将dispatch从父组件传递到props中的此组件。您可以使用props.dispatch访问它。

来源

2017-01-16 06:03:21 nrgwsth

我明白这个概念，但我不知道在这种情况下，组件是如何接收调度的。我的印象是接收调度函数，我需要传递一个mapDispatchToProps，在这种情况下并不是这样。是不是因为我将组件传递给连接函数，现在它以某种方式接收调度？ – Nate

调度将作为道具从父组件传递到此组件。 – nrgwsth

但这种做法并不好。你应该使用connect来传递调度和道具。阅读gaearon的评论[这里]（https://github.com/reactjs/redux/issues/1176） – nrgwsth

如何在没有map的情况下连接工作DispatchToProps

回答

相关问题