这是我的代码:
class App extends Component {
constructor() {
super();
this.state = {
data: [
{
name: 'Jal Irani',
imgURL: './man.jpg',
hobbyList: ['Front-end Web Development', 'Back-end Web Development', 'Eating Free Food'],
},
],
};
}
render() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h1 className="App-title">Welcome to Profiler</h1>
</header>
<p className="App-intro">//access the json data here</p>
</div>
);
}
}
我想访问
中的 json 元素<p className="App-intro">//access the json data here.
我尝试使用 react map 功能但没有成功。
有什么帮助吗?是 React js 中的新内容。
最佳答案
import React from "react";
class App extends React.Component {
constructor() {
super();
this.state = {
data: [
{
name: "Jal Irani",
imgURL: "./man.jpg",
hobbyList: [
"Front-end Web Development",
"Back-end Web Development",
"Eating Free Food"
]
}
]
};
}
render() {
const { name, imgURL, hobbyList } = this.state.data[0];
console.log(name);
console.log(imgURL);
console.log(hobbyList);
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h1 className="App-title">Welcome to Profiler</h1>
</header>
<p className="App-intro" />
</div>
);
}
}
关于javascript - 在react js中访问json文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50236677/