如何在React中导入json文件
如何在React中导入json文件
提问于 2018-06-06 02:46:56
我需要导入json数据来运行react redux测试。如何将devMock.json导入dashboard.test.js？我可以在不安装依赖项的情况下这样做吗？
devMock.json
{
"data": {
"0": 11,
"1": 1
},
"polarity_freq": {
"negative": 214,
"positive": 220
},
"sentiments_freq": {
"anger": 1,
"fear": 0,
"sad": 2,
"joy": 11
}
},dashboard.test.js
import * as actions from '../actions/dashboardActions';
import * as types from '../actions/actionTypes';
import configureMockStore from 'redux-mock-store';
import thunk from 'redux-thunk';
import expect from 'expect';
import fetchMock from 'fetch-mock';
const middlewares = [ thunk ]
const mockStore = configureMockStore(middlewares)
describe('Dashboard action creators should be called', () => {
afterEach(() => {
fetchMock.reset()
})回答 3
Stack Overflow用户
回答已采纳
发布于 2018-06-06 02:51:38
您可以将您的.json文件更改为.js。就像这样：
export {
"data": {
"0": 11,
"1": 1
},
"polarity_freq": {
"negative": 214,
"positive": 220
},
"sentiments_freq": {
"anger": 1,
"fear": 0,
"sad": 2,
"joy": 11
}
};之后，只需像导入普通.JS文件一样导入它即可。
import DevMock from './devMock.js';Stack Overflow用户
发布于 2018-06-06 03:58:30
对于您的用例，Matheus' answer是正确的解决方案，尽管您必须指定要导出的对象的标识符，如下所示：
export const myJson = {
"data": {
"0": 11,
"1": 1
},
"polarity_freq": {
"negative": 214,
"positive": 220
},
"sentiments_freq": {
"anger": 1,
"fear": 0,
"sad": 2,
"joy": 11
}
};然后，您可以像这样导入它：
import { myJson } from "./myJson.js";此外，如果只导出文件中的一个对象，则可以使用默认导出：
export default { ... }然后使用所需的名称导入：
import myAwesomeJson from "./myJson.js";Stack Overflow用户
发布于 2019-09-19 08:42:01
这只适用于我在主App.js中导入JSON文件，并将json对象传递给props中的子组件的情况。
当我尝试在子组件中直接导入json时，仅当子文件导入App时才导入json对象，而不是在渲染子组件时导入。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50707019
复制相关文章
相似问题