Javascript 如何从另一个类调用状态变量？

Search.js

class Search extends Component {
  constructor() {
    super();
    this.state = {
      selectedPictures: []
    }
  }

  static getSelectedPictures = () => {
      return this.state.selectedPictures;
  }

  render() {
    return (
      <div>
        ...
      </div>
    );
  }


}

export default Search;

import Search from './Search';

class Other extends Component {
      constructor() {
        super();
        this.state = {

        }
      }


     render() {
       console.log(Search.getSelectedPictures); --> Uncaught null
       return (
         <div>
           ...
        </div>
        );
     }
    }

export default Other;

类搜索扩展组件{
构造函数（）{
超级（）；
此.state={
所选图片：[]
}
}
静态getSelectedPictures=（）=>{
返回this.state.selectedPictures；
}
render（）{
返回(
...
);
}
}
导出默认搜索；

Other.js

class Search extends Component {
  constructor() {
    super();
    this.state = {
      selectedPictures: []
    }
  }

  static getSelectedPictures = () => {
      return this.state.selectedPictures;
  }

  render() {
    return (
      <div>
        ...
      </div>
    );
  }


}

export default Search;

import Search from './Search';

class Other extends Component {
      constructor() {
        super();
        this.state = {

        }
      }


     render() {
       console.log(Search.getSelectedPictures); --> Uncaught null
       return (
         <div>
           ...
        </div>
        );
     }
    }

export default Other;

从“/Search”导入搜索；
类其他扩展组件{
构造函数（）{
超级（）；
此.state={
}
}
render（）{
console.log（Search.getSelectedPictures）；-->uncaughtnull
返回(
...
);
}
}
出口违约其他；

如何在Other.js中调用Search.state.selectedPictures

我已经尝试使用静态方法返回

this.state.selectedPictures

并调用Other.js，但无法访问

是否有任何方法可以导入或转移var？两个js文件都是独立的文件

---

谢谢。

出于以下几个原因，您试图做出的反应实际上是不可能的。首先，您尝试在类上而不是对象上调用方法和访问属性。在普通（现代）JS中，需要使用

new

关键字实例化类。例如，

search=newsearch（）；search.getSelectedPictures（）

-然而，这并不是React的工作原理，因为类实际上是组件，所以必须在渲染函数中使用组件语法

至于访问

Search

中的状态，您需要将该状态从

Search

传递到

Other

一种方法是将状态直接传递到道具中，因此在search.js中：

render() {
  <Other selectedPictures={this.state.selectedPictures} />
}

render（）{
}

然后在other.js中：

render() {
  this.props.selectedPicture.forEach((pic) => <img src={pic} />);
}

render（）{
this.props.selectedPicture.forEach（（pic）=>）；
}

或者，您可以有一个更完整的父组件，并将状态保持在其中。然后，如果您列出的组件不具有父子关系，则同时将该状态传递给这两个组件

---

还有一些方法，尽管稍微复杂一些，但是作为

Other

的孩子，使用

Search

做你想做的事情，但是如果不知道这两个组件实际上是什么，就很难真正分辨。

使用flux架构。简单的实现是

alt通量

---

只需创建一个操作和存储。当您选择图像时，只需使用Action将其放入商店，然后使用

将其作为道具使用

搜索。selectedPictures

功能？它不会出现在您的代码中。我想你不是指状态。selectedPictures？@MattFletcher我想访问Other.jsAh中的

Search.state.selectedPictures

，你用“调用”这个词把我弄糊涂了，就像它是一个函数一样。搜索

和
Other
之间的关系是什么？一个是另一个的子组件吗？他们是兄弟姐妹吗？最有可能的是，你需要将状态向上移动到一个普通的父级，然后用道具将状态传递下去。是的<代码>搜索本身是一个类，而不是构造的对象。在实例化之前，不能只调用方法或从中获取属性。React的实例化方法意味着你不能只做
新搜索（）
，所以你可能需要
成为
的孩子，或者像C-a说我对我的React有点生疏，所以如果有人对我的答案有任何补充或更正，请随意编辑，或者让我知道，我会补偿的。@DonaldWu没问题。它为你回答了这个问题吗？