Question

拥有一个按要求删除元素的代码

class ArchOrDlt extends Component{
    constructor(props) {
      super(props)
    }

    deleteItem(itemId, e) {
        console.log(itemId);
      this.props.test();
      this.props.DeleteListProfileItem(itemId);

    }
    ArchOrDlt() {

      const isdel = this.props.isdel;
      const itemId = this.props.itemId;
      if (isdel == 1) {
        return (<div><a onClick={this.deleteItem.bind(this, itemId)} >delete</a></div>);
      }
        return (<div>archived</div>);
    }
    render() {
      return (
        <div>
        {this.ArchOrDlt()}
        </div>
      );
    }

  }

如果我按下链接，我会收到Uncaught TypeError：this.props.test不是函数

我派遣道具

const mapDispatchToProps = function(dispatch) {
  return {
      IncomeListProfile: () => dispatch(IncomeProfileList()),
      DeleteListProfileItem: (id) => dispatch(DeleteListProfileItem(id)),
      openPopUp: () => dispatch(openPopUp()),
      test: () => dispatch(test())
      }
  }

无法理解如果我移动this.props.test（）;为什么它会在exaple中发生？再次点击，一切正常，有完整的组件 https://plnkr.co/edit/OEugCIxoAGE8iVb57WOa?p=catalogue

Answer 1

首先，您应该使用redux

中的bindActionCreators函数

import { bindActionCreators } from 'redux';
...
const mapDispatchToProps = (dispatch) => {
  return {
    IncomeListProfile : bindActionCreators(IncomeProfileList, dispatch),
    ...
  }
}

http://redux.js.org/docs/api/bindActionCreators.html

this.props不是函数（reactjs）

1 个答案: