Как передать переменную из одного компонента в другой, никак не связанный РЕАКТ - PullRequest
Новая
       12

Как передать переменную из одного компонента в другой, никак не связанный РЕАКТ

0 голосов
/ 13 апреля 2019

У меня есть компонент A, который выбирает данные.Я сохранил imdb_id из API в константную переменную с именем «imdb_id».Теперь я хочу передать эту переменную другому компоненту.Если я передам его как PROP, то этот компонент будет отображаться вместе с компонентом A, а это не то, что мне нужно.Я просто хочу передать свою переменную, чтобы я мог использовать эту переданную переменную в компоненте B, чтобы получить больше данных на основе значения переменной ... Как я могу это сделать?IM NEW, чтобы РЕАГИРОВАТЬ.В буквальном смысле, 3-й день с использованием реакции, так что, пожалуйста, сделайте это легко для меня.

Передайте "const movieImdbID = data.imdb_id" Компоненту B как-то ....?

Попытка прохождения через подпорки> КомпонентB отображается с компонентом A (НЕ ТО, ЧТО Я ХОЧУ)

Компонент A: 

 handleClick = (e, data) => {
    const movieImdbID = data.imdb_id
    alert(movieImdbID)
    // return <Movie movieImdbID="tt4355435" />
  };

  render() {
    const { data, movieImdbID } = this.state;
    return (
      <React.Fragment>
        <div className="container-fluid">
          <div className="row">
            {data.length
              ? data.map(data => (
                  <div
                    className="col-sm p-0 my-2"
                    key={data._id}
                    onClick={e => this.handleClick(e, data)}
                  >
                    <Link to="/Movie">
                      <div className="movie-wrap my-2">
                        <img
                          className="movie-images"
                          src={data.images.banner}
                          alt="movie"
                        />
                        <h6 className="movie-title text-center text-uppercase">
                          {data.title}
                        </h6>
                      </div>
                    </Link>
                  </div>
                ))
              : null}
          </div>
        </div>
      </React.Fragment>
    );
  }

Компонент B 

import React, { Component } from "react";

class Movie extends Component {
  render() {
    return (
      <div>
        <div className="text-success text-center">Movie Component</div>
      </div>
    );
  }
}

export default Movie;
...