BenderIsGreat34
@BenderIsGreat34
junior front-end

Как я могу передать массив в другой компонент?

Я получаю через апи 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'>&#128269;</span>
                 </button>
             </div>
         </div>
     );
 }
}

а вот сюда я хочу запихнуть данные из апи
class HomePage extends Component {
    render() {
        return (
            <div>

            </div>
        );
    }
}

export default HomePage;

прочитал эту статью, но чёт так и не получилось передать
  • Вопрос задан
  • 402 просмотра
Решения вопроса 1
Krasnodar_etc
@Krasnodar_etc
fundraiseup
У родителя делаешь state и метод, который принимает в качестве аргумента данные о фильме и кладёт их в state

Метод прокидываешь в Search через пропсы

В Search.getMovie после получения необходимых данных вызываешь метод из пропсов, передаёшь в него данные

В родителе, данные из state должны прокидываться в HomePage
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы