React演示组件未收到来自智能组件的MapDispatchToProps

这真的很奇怪&尴尬&我似乎无法理解这里出现了什么问题。React演示组件未收到来自智能组件的MapDispatchToProps

这里是“聪明”的成分：

import { connect } from "react-redux"; 
import TemplateParent from "../component/svg/TemplateParent"; 
import { setInitialViewBox } from "../modcon/Actions"; 

const mapStateToProps = ({ svgTemplateState }) => { 
    return({ 
     renderType : "Template Selection", 
     svgTemplateState : svgTemplateState 
    }); 
}; 

const mapDispatchToProps = (dispatch) => { 
    return({ 
     dispatchSetInitialViewBox : (viewBoxCoOrdinates) => { 
      dispatch(setInitialViewBox(viewBoxCoOrdinates)); 
     } 
    }); 
}; 

const C_TemSelectionSVGTemplate = connect(mapStateToProps, mapDispatchToProps)(TemplateParent); 
export default C_TemSelectionSVGTemplate;

这里是“演示”组件：

import React from "react"; 
import { calcViewBoxCentre } from "../../modcon/GlobalAPI"; 

const TemplateParent = React.createClass({ 
componentDidUpdate : function(){ 
    let getEleDimension = this.gEle.getBBox(), 
     viewboxValue = calcViewBoxCentre(getEleDimension, 1.75); 
    /*** ERROR IS HERE: this.props.dispatchSetInitialViewBox is not a function ***/ 
    this.props.dispatchSetInitialViewBox(viewboxValue); 
}, 

render : function(){ 
    /*** the below console logs only shows two props: `renderType` & `svgTemplateState` ***/ 
    console.log(this.props); 
    return(
     <g className = "templateParent" 
      ref = {(g) => this.gEle = g }> 
     </g> 
    ); 
} 
});

我似乎无法弄清楚，为什么mapDispatchToProps没有被作为道具传递到组件TemplateParent。

按照要求，这里是行动的创建者setInitialViewBox：

export const setInitialViewBox = (viewBox) => { 
    return({ 
     type : SET_INITIAL_VIEWBOX, 
     svgPayload : { 
      defaultTab : { 
       viewBox : viewBox, 
       scale : 1 
      }, 
      bodyTab : { 
       viewBox : viewBox, 
       scale : 1 
      }, 
      sleeveTab : { 
       viewBox : viewBox, 
       scale : 1 
      } 
     } 
    }); 
};

来源

2017-01-30 Kayote

不一定相关，但我认为你是出口TemplateParent组件？ – Pineda

是的，我是。我不得不简化演示组件'TemplateParent'，因为那里正在进行一些计算。但是，是的，这是'出口默认TemplateParent' – Kayote

告诉我们'setInitialViewBox'行动 – lux

我看了你的代码，我不抓你的问题，但我有一些注意事项：

你不应该通过你的mapDispatchToProps中的参数viewBoxCoOrdinates。您可以检查bindActionCreators可能是解决为例：

import {bindActionCreators} from 'react-redux'; 
const mapDispatchToProps = (dispatch) => { 
    return({ 
     dispatchSetInitialViewBox : bindActionCreators(viewBoxCoOrdinates, dispatch) 
     } 
    }); 
};

，您可以通过props.dispatchSetInitialViewBox访问功能（）;

更多的相关信息：bindActionCreators

来源

2017-01-30 19:35:02

谢谢你的答案，但是，我不知道这会给代码带来什么好处。在我的代码中，'TemplateParent'是redux知道的，所以我不认为传递'viewBoxCoOrdinates'应该有任何问题。如果我缺少一些东西，请纠正我。我读过丹的页面链接，但是，没有看到好处。 – Kayote

您可以使用速记符号来调度映射到道具这样的：

export default connect(mapStateToProps, { setInitialViewBox })(TemplateParent);

而在你的组件，你可以做this.props.setInitialViewBox。

来源

2017-01-30 19:49:49

React演示组件未收到来自智能组件的MapDispatchToProps

回答

相关问题