Question

我在项目中使用Redux Bees库。这个库提供了一个名为[query][2]的HOC。

他们给出的例子是：

import React from 'react';
import api from './api';
import { query } from 'redux-bees';

@query('posts', api.getPosts)

export default class App extends React.Component {
  render() {
    const { posts, status } = this.props;

    return (
      <div>
        {
          !status.posts.hasStarted &&
            'Request not started...'
        }
        {
          status.posts.isLoading &&
            'Loading...'
        }
        {
          status.posts.hasFailed &&
            JSON.stringify(status.posts.error)
        }
        {
          posts &&
            JSON.stringify(posts)
        }
      </div>
    );
  }
}

如您所见，它使用此HOC作为装饰器。由于目前我的项目不允许使用装饰器，我想知道是否仍然可以以标准的，合成的方式使用这个HOC。

由于我非常确定装饰器只是标准类功能的一些糖，我认为这是可能的，但我无法弄清楚它是如何完成的。

我试过了：

const withApiData = query('post', api.getPage, (perform, props) =>
  perform({ id: props.match.params.id })
)

然后将导出包装在withApiData：

中

export default withApiData(connect(mapStateToProps, mapDispatchToProps)(Page))

但这不起作用。我甚至可能追求的是什么？

Answer 1

说得太快了：它实际上就像我描述的那样工作，事实证明这个错误源于HOC硬连线使用某个redux存储密钥的事实，我认为这是可配置的。

为后人保留这个：）

以标准合成方式

1 个答案: