如何解决如何从获取的JSON对象获取值并在react中显示它
我从WordPress获取数据以做出反应。如果数据采用数组格式,则可以获取,显示内容并进行映射。但是当涉及到JSON对象时,我在显示想要的部分时遇到了问题,而且也无法映射它。
我的json对象简化= http:// myname / wp-json / wp / v2 / pages / 2
{
"id": 2,"date": "","guid": {
"rendered": ""
},"content": {
"rendered": "\n<p>Dit is een voorbeeldpagina. Gevestigd in Gotham City,XYZ heeft meer dan 2000 mensen in dienst en doen allemaal fantastische dingen voor de community in Gotham.</p>","protected": false
},"_links": {
"self": [
{
"href": "..."
}
],"collection": [
{
"href": "..."
}
]
}
}
我的useFetch组件
export default function useFetch(url) {
const [data,setData] = useState([]);
useEffect(() => {
async function loadData() {
const response = await fetch(url);
if(!response.ok) {
// oups! something went wrong
return;
}
const posts = await response.json();
setData(posts);
}
loadData();
},[url]);
return data;
}
我要显示数据的组件
function Page(props) {
const voorbeeldpagina = useFetch(
"http://myname/wp-json/wp/v2/pages/2"
);
// const newArray = Object.entries(voorbeeldpagina)
// I have also tried OBject.keys and Object.values
return (
<div>
<h1>Page Component</h1>
<div> {**I want to show `content.rendered` from my json object**} </div>
</div>
)
}
我想从我的json对象中显示content.rendered
有人可以帮忙吗?
谢谢!
解决方法
好吧,您正在尝试映射一个对象,可以使用object.keys来映射它们。
Object.keys(posts).map((key)=>return(
//your code goes here
)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。