0

所以,这里真的很简单。我正在使用 React Highcharts Official,对于 ReactHighcharts 上的 options 属性,我想从另一个文件导入 graphOptions。

<ReactHighcharts highcharts={Highcharts} options={graphOptions} />

现在,这很容易,但是在我尝试导入的文件上,我有一个名为 this.addData() 的方法。

export const graphOptions = {
    title: {
        text: 'title '
    },
    yAxis: {
        title: {
            text: 'Points'
        }
    },
    xAxis: {
         title: {
            text: 'Date'
        }
     },
    series: this.addData()
};

好的,所以我知道我可以在我的反应渲染区域中有这个文件,但是如果我在我的系列代码上有一个 this 语句,有没有办法在那里导入它,如上所示?

4

2 回答 2

1

一种方法是导出函数,即 getGraphOptions 而不是对象,然后在导入后将其与this当前反应类绑定。

export const function getGraphOptions() {
   return {
    // object
    series: this.addData()
}

并在反应文件中。

import { getGraphOptions } from './...'
this.getGraphOptions = getGraphOptions.bind(this);
于 2018-12-10T10:58:29.433 回答
0

您可以简单地将新属性分配给graphOptions对象 in constructor,已经可以访问适当的方法:

import options from "./options.js";

class App extends React.Component {
  constructor(props) {
    super(props);

    options.series = this.addData();
    this.state = {
      options: options
    };
  }

  addData() {
    return [
      {
        data: [1, 2, 3]
      }
    ];
  }

  render() {
    return (
      <HighchartsReact highcharts={Highcharts} options={this.state.options} />
    );
  }
}

现场演示:https ://codesandbox.io/s/m7xvq7z468

于 2018-12-11T11:01:37.753 回答