大家好，我是 ReactJS 和 Axios 的新手。我嘗試從 Instagram Api 獲取資料，如果影像在標題中有特殊字母，我想渲染影像，例如如果標題有“Y”字母應該在頁面上呈現，否則不會。使用我的代碼，我從個人資料中呈現所有帖子，但我無法對資料進行排序，我想要的方式請幫助我[！[
export default class Home extends React.Component {
state = {
posts: []
}
componentDidMount() {
axios.get("https://graph.instagram.com/me/media?fields=id,caption,media_url,permalink,username&access_token=IGQVJWM3BtaTNEQW9iYXBNZA3JwUU")
.then(res => {
const posts = res.data.data;
this.setState({ posts });
})
}
render() {
return (
<div>
{
this.state.posts
.map(post =>
<div className="banner_image">
<img className="post_img" key={post.id} src={post.media_url} alt="image"/>
<div className="banner_text">
<div className="banner_content">
{
this.state.posts
.map(post =>
<h1 className="main_title" key={post.id}>{post.username}</h1>
)
}
{this.state.posts
.map(post =>
<h3 className="main_caption" key={post.id}>{post.caption}</h3>
)
}
</div>
</div>
</div>
)
}
</div>
)
}
}
][2]
uj5u.com熱心網友回復：
我會遠離基于類的反應組件，因為建議使用功能樣式。您沒有在帖子映射中進行任何排序，這就是它不起作用的原因。你在哪里做你的this.state.posts.map，我會用過濾器鏈接它以洗掉你不想要的帖子。所以它會是這樣的：
this.state.posts
.filter(post => post.includes('Y'))
.map(post => ...)
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/440169.html
標籤：javascript 反应 api facebook-graph-api axios