I want to get a Image with spesific Text in caption from Instagram graph api.For example if caption from image has "yes" word in Instagram then must show in homepage.The problem is i know i cant write if promises in axios or maybe i dont know how to write this rule.thank you for your help.
import React from 'react'
import '../styles/home.css'
import axios from 'axios';
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=IGQ....`)
.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>
)
}
{
this.state.posts
.map(post =>
<img className="post_img_food" key={post.id} src={post.media_url} alt="image"/>
)
}
</div>
)
}
}
You could try .indexOf and make a if statement that finds the string "yes" if its there it will display that picture if not elif or end.
var caption = "This is some generic sentence that contains the word yes";
var substring = "yes";
console.log(caption.indexOf(substring) !== -1)