尝试实现HOC时,TypeError:Object(…)不是函数

时间:2019-12-30 13:46:03

标签: reactjs higher-order-components high-order-component

我已经尝试阅读the accepted answer over here和其他帖子,但是无法退出,这对我是否有帮助。我觉得情况有所不同。

我看了一些有关如何使用HOC的示例,似乎就像我一样。是因为我试图使用HOC来实现connect吗?

这是我的HOC:

import React from "react";
import { connect } from "react-redux";

const withResults = WrappedComponent => {
  return class extends React.Component {
    render() {
      return <WrappedComponent {...this.props} />;
    }
  }
};

const mapStateToProps = state => {
  return {
    results: state.results
  };
};

export default connect(mapStateToProps)(withResults);

这是我要使用HOC包装的组件:

import React, { useContext } from "react";
import WithResults from "./withResults";
import SingleResult from "../singleResult/Primary";
import { PrimarySearchTermContext } from "../../providers/PrimarySearchTermProvider";


const PrimaryResults = props => {
  const { currentSearchTerm } = useContext(PrimarySearchTermContext);

  const compare = (a, b) => {
    if (a.resultCount > b.resultCount) return 1;
    if (b.resultCount > a.resultCount) return -1;

    return 0;
  };

  const renderResults = () => {
    //According to requirements, this search starts showing results after the third character
    if (props.results[0] === undefined || currentSearchTerm.length <= 2)
      return null;

    const relevantResults = [];
    props.results[0]
      .sort(compare)
      .reverse()
      .map(result => {
        if (result.term.toLowerCase().includes(currentSearchTerm.toLowerCase()))
          relevantResults.push(result);
      });

    return relevantResults.slice(0, 4).map(result => {
      if (currentSearchTerm === result.term) return null;
      return (
        <SingleResult
          searchTerm={currentSearchTerm}
          term={result.term}
          resultCount={result.resultCount}
          key={result.term}
        />
      );
    });
  };

  return <div className="results">{renderResults()}</div>;
};

export default WithResults(PrimaryResults);

我一直遇到的错误是包装组件中导出的最后一行。

4 个答案:

答案 0 :(得分:0)

尝试这样导出:

i = 0

答案 1 :(得分:0)

尝试一下: hierarchy = cmds.ls('joint', long=True)[0] def get_groups(hierarchy=None): nodes = [node for node in hierarchy.split('|') if node] return [x for x in nodes if cmds.listRelatives(x, shapes=True) is None and cmds.nodeType(x) == 'transform'] print(get_groups(hierarchy))

答案 2 :(得分:0)

因此,这样的导出最终解决了我的问题:

const composedWithResults = compose(connect(mapStateToProps, null), withResults);

export default composedWithResults;

作为一个初学者,我会诚实地说,我不辞职不知道为什么,但是它有效。做某人的解释会很好。

答案 3 :(得分:0)

在您的 HOC 中试试这个:

 export default (WrappedComponent) => connect(mapStateToProps)(withResults(WrappedComponent));