通过 dispatch 和 getstate 从 reduxjs 传递后，反应 HOC 组件不工作

Question

下面有一段代码在转换为 HOC 组件之前运行良好：

class Filters extends React.Component {
  componentDidMount() {
    const { store } = this.context;
    this.unsubscribe = store.subscribe(() => this.forceUpdate());
  }

  componentWillUnmount() {
    this.unsubscribe();
  }

  render() {
    const { store } = this.context;
    const currentFilter = store.getState().visibilityFilter;
    const tags = ["All", "Active", "Completed"];
    return (
      <>
        Show:{" "}
        {tags.map((t, index) => {
          if (t === currentFilter) {
            return (
              <a href="#">
                {t + " "}
                {index === 2 ? " " : ","}
              </a>
            );
          }
          return (
            <a
              onClick={() => {
                store.dispatch({
                  type: "SET_VISIBILITY_FILTER",
                  filter: t
                });
              }}
            >
              {t + " "}
              {index === 2 ? " " : ","}
            </a>
          );
        })}
      </>
    );
  }
}
Filters.contextTypes = {
  store: React.PropTypes
};

我将其更改为如下所示的 HOC 组件，它无法正常工作，也没有错误 notification.This 代码来自规范教程 todolist 来自 reduxjs 官方 document.I 检查 react 官方记录 https://reactjs.org/docs/higher-order-components.html 并没有发现任何不遵守其 rules.Does 的异常，有人知道什么是错误吗？

const Originfilters = ({ currentFilter, handleClick = (f = f) }) => {
  const tags = ["All", "Active", "Completed"];
 
  return (
    <>
      Show:{" "}
      {tags.map((t, index) => {
        if (t === currentFilter) {
          return (
            <a href="#">
              {t + " "}
              {index === 2 ? " " : ","}
            </a>
          );
        }
        return (
          <a
            onClick={(t) => {
              handleClick(t);
            }}
          >
            {t + " "}
            {index === 2 ? " " : ","}
          </a>
        );
      })}
    </>
  );
};
class Filters extends React.Component {
  componentDidMount() {
    const { store } = this.context;
    this.unsubscribe = store.subscribe(() => this.forceUpdate());
  }

  componentWillUnmount() {
    this.unsubscribe();
  }

  render() {
    const { store } = this.context;
    return (
      <Originfilters
        currentFilter={store.getState().visibilityFilter}
        handleClick={(filter) => {
          store.dispatch({
            type: "SET_VISIBILITY_FILTER",
            filter
          });
        }}
      />
    );
  }
}
Filters.contextTypes = {
  store: React.PropTypes
};

Answer 1

这个逻辑现在已经过时了，取消这个问题

通过 dispatch 和 getstate 从 reduxjs 传递后，反应 HOC 组件不工作

react HOC component not working after passed with dispatch and getstate from reduxjs

redux

react-hoc