不应从默认导出模块导入指定的导出'todos'(作为"todos"导入)(只有默认导出即将可用)

Question

import React, { Component } from 'react';
import './App.css';
import { todos } from './todos.json';
console.log(todos);
class App extends Component {
render() {
return (
<div className='App'>

</div>
)
}
}
export default App;

那是我的应用程序，而且我想让todos.json显示todos.json 中的每个句子

我的错误：

编译有问题：X

中的错误/src/App.js 8:12-17

不应从默认导出模块导入命名导出"todos"(导入为"todo"(

{
"todos": [
{
"frase": "la vida es bella",
"autor": "La pelicula xd"
},
{
"frase": "El iq esta sobrevalorado",
"autor": "ni idea xd"
},
{
"frase": "ganar es lo unico importante",
"autor": "Ayanokoji"
}
]
}

我想在我的应用中显示todos.json

Answer 1

您不能以这种方式导入json

它应该是import json from './todos.json'，或者您可以将todos.json文件转换为todos.js文件，然后像这个一样直接导出对象

todos.js

const json = {
"todos": [
{
"frase": "la vida es bella",
"autor": "La pelicula xd"
},
{
"frase": "El iq esta sobrevalorado",
"autor": "ni idea xd"
},
{
"frase": "ganar es lo unico importante",
"autor": "Ayanokoji"
}
]
}
export default { todos } = json 

Answer 2

JSON文件没有命名导出，所以听起来错误是说不能使用命名导入。只需导入整个结构。如果你想把它分解成一个特定的变量，可以在另一行进行：

import data from './todos.json';
const { todos } = data;