数据模拟的反应解析器

Question

我想使用react-resolver 模块来使用我的数据模拟，但我不确定我做错了什么。

目前我有以下情况正常工作

我有我的数据对象：

const data = [
  {
    team: "TeamA",
    position: "dx",        
    active: "No",
  },
  {
    team: "TeamB",
    position: "dx",        
    active: "Yes",
  },
  {
    team: "TeamC",
    position: "sx",        
    active: "No",
  },
  {
    team: "TeamD",
    position: "dx",        
    active: "No",
  },
  {
    team: "TeamE",
    position: "dx",        
    active: "No",
  }
]

我可以映射它并将这个数据对象呈现在我的表格组件的行中，例如rows={renderRows(data)}

现在我想使用react-resolver，我已经创建了一个 Mock 文件夹，我已经放置了我的数据对象。

这就是现在的样子

import { resolver } from "../../path/of/my/resolver";

export const newDataResolver = resolver({

    const data = [
      {
        team: "TeamA",
        position: "dx",        
        active: "No",
      },
      {
        team: "TeamB",
        position: "dx",        
        active: "Yes",
      },
      {
        team: "TeamC",
        position: "sx",        
        active: "No",
      },
      {
        team: "TeamD",
        position: "dx",        
        active: "No",
      },
      {
        team: "TeamE",
        position: "dx",        
        active: "No",
      }
    ]

});

我现在像这样在我的组件中导入它

import { newDataResolver } from "../Mock"

我现在如何在我的renderRows 中使用我的newDataResolver 对象，它是从模型导入的？

这是一个非常基本的问题，但我很挣扎。我现在想做类似rows={renderRows(newDataResolver)}

Answer 1

尝试使用装饰器语法：

import { resolve } from "react-resolver";

const data=[...]

@resolve("newData", function(props) {
  return data
})
class SomeComponent extends React.Component {
  render() {
    const { newData } = this.props;

    return <SomeOtherComponent {renderRows(newData)} />
  }
}

这相当于异步加载newData并将其提供给组件，就像直接提供一样：

<SomeComponent newData={newData} />

编辑： 为了达到你的目的：

import { newDataResolver } from "../Mock"

 export default newDataResolver(SomeComponent)