0

我的 src/assets 文件夹中有一个包含一些数据的 js 文件。我需要将该数据调用到我的反应组件中,以将其显示在 PLotly.js 的图表中

我曾尝试调用数据,但一直收到错误消息,提示找不到路径。我应该把它变成一个json文件吗?

我的数据文件:

{
    "data":[
      {
        "x": [40, 80, 120, 160, 200, 240, 280, 320, 360, 400, 440, 480, 520, 560,],
        "y": [-11.98752097, -11.98587175, -11.9840901,  -11.98657347, -11.98618678, -11.98618678],
        "type": "scatter",
        "name":"logResPerm",
        "mode": "lines+markers",
        "marker": "{color:'red'}",
      },
    ]
}

反应组件:

export const ScatterChart= () => { 
    return (
        <Plot {data.map((data,key)=>{
            return(
                {data}
            )
        })}/>
    )
}
4

1 回答 1

0

将其写为变量并导出

 export const chartData = {
            "data":[
              {
                "x": [40, 80, 120, 160, 200, 240, 280, 320, 360, 400, 440, 480, 520, 560,],
                "y": [-11.98752097, -11.98587175, -11.9840901,  -11.98657347, -11.98618678, -11.98618678],
                "type": "scatter",
                "name":"logResPerm",
                "mode": "lines+markers",
                "marker": "{color:'red'}",
              },
            ]
        }

在您的组件中,您需要导入它

import { chartData } from 'path/to/file'

export const ScatterChart = () => { 
    ... do code here, like chartData.data.map() 
}
于 2021-02-10T00:24:19.723 回答