Я получаю через апи json с фильмом по клику в одном компоненте и хочу передать этот массив в другой компонент, там где он собственно и будет рендериться. Но не могу понять, как его передать.
это родительский компонент
export default class PageMain extends React.Component {
render(cn) {
return (
<div className={ cn() }>
<Header />
<Search />
<HomePage />
</div>
);
}
}
это компонент, где собственно и происходит клик и получение json
export default class Search extends Component {
getMovie = () => {
const input = document.querySelector('.search__input');
const film = input.value;
const filmName = film.replace(/[ ]/g, '+');
const api = `http://www.omdbapi.com/?t=${filmName}&apikey=575d30b5`;
// eslint-disable-next-line no-undef
const promise = fetch(api);
promise
.then(resp => resp.json())
}
render() {
return (
<div className='search'>
<div className='search__wrapper container'>
<label className='search__label' htmlFor='searchBtn'>
<input type='search' className='search__input' />
</label>
<button type='button' id='searchBtn' className='search__btn' onClick={ this.getMovie }>
<span role='img' aria-label='search-image'>🔍</span>
</button>
</div>
</div>
);
}
}
а вот сюда я хочу запихнуть данные из апи
class HomePage extends Component {
render() {
return (
<div>
</div>
);
}
}
export default HomePage;
прочитал эту
статью, но чёт так и не получилось передать