小编sud*_*ree的帖子

我有两个组件SideNav和Dashboard(两个在不同的js文件中).SideNav将selectbox作为过滤器.我必须将一个数组从Dashboard组件传递给Sidebar组件.此数组必须作为选择框的值(在sidenav组件内)给出.

PS如果我在两个不同的JS文件中定义了两个不同的组件类,那将是什么情况.例如HomeComponent/Home.js - >父组件Dashboard/Dashboard.js - >子组件我正在对"Home.js"文件进行API调用并获取一些数据.我想将这些数据传递给"Dashboard.js"文件(组件)我研究过的所有示例中,它们都在同一个JS文件中显示了两个组件.

class Dashboard extends Component {
  constructor(props) {
    super(props);
    this.state  = {viz:{},filterData:{}};
  }
  var data1= ['1','2','3'];
  this.setState({data1: data1}, function () {
     console.log(this.state.data1);
  });

 }

//Sidebar

class Sidebar extends Component {

   constructor(props) {
     super(props);
     this.state  = {
       data: ['opt1','opt2']
     };
   }

  handleClick(e) {
    e.preventDefault();
    e.target.parentElement.classList.toggle('open');
    this.setState({data: this.state.data1}, function () {
      console.log(this.state.data);
    });
  }

  render() {

    const props = this.props;
    const handleClick = this.handleClick;

    return (
      <div className="sidebar">
        <nav className="sidebar-nav">
          <Nav>
            <li className="nav-item nav-dropdown">
              <p className="nav-link …