Javascript 访问组件之间的变量

我有两个组件App和SomeComponent

我想从SomeComponent获取应用程序中的access变量

应用程序：

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

var places = [];

class App extends Component {

  state = {isLoading:true}
   render(){
bla-bla...}
}

export default App;

SomeComponent：

import React from 'react'
import App from '../App'

class SomeComponent extends React.Component {
  componentDidMoint(){
    console.log('Check access places array',App.places)
  }
  render(){
    bla-bla...

  }
}

export { SomeComponent }

但是它的cougheout位置未定义，而不是show空数组。这里怎么了？
是的，我试过不同的变体。。。但是没有成功。

---

谢谢

您需要从应用程序导出

export const places = [];

还有child.app

import React from 'react'
import { places } from '../App'

class Child extends React.Component {
  componentDidMoint(){
    console.log('Check access places array',places)
  }
  render(){
    bla-bla...

  }

---

在React中将数据从父组件传递到子组件的方法是通过props。例如，您可以将数组作为

放置

道具传递给您的

子组件

并从

this.props

访问它

示例

类应用程序扩展了React.Component{
状态={isLoading:true，位置：['foo'，'bar']}
render（）{
返回
}
}
子类扩展了React.Component{
componentDidMount（）{
log（'Check access places array'，this.props.places）
}
render（）{
返回儿童
}
}
render（，document.getElementById（“根”））

不要将应用程序导入子应用程序。在应用程序中，将React的render方法与JSX一起使用，以声明child的实例。在应用程序的子JSX中，这些属性将作为“道具”在子JSX中可用。请参阅React，React需要一种编程结构，它不像straight JS那样“免费”，但React提供了一种简洁、集成的方式来制作小部件和SPA。
Ok。但是这个字符串：export-var-places=[]；指定空值。当我调用此位置时，我实际上需要获取位置的当前值。如果您的位置在运行时发生更改，并且需要传递给子组件，您应该将其作为该子组件的道具传递。我刚刚测试了您的建议。。。它们都是：导出变量位置=[]；和*export-var-places*-相同的未定义值，例如
export-var-places=['London'，'Paris']喜欢的东西，那么你就可以这样做了。不。刚刚测试过。同样——不确定的担忧。我知道道具。我的问题是错的。我需要在不是父子关系而是彼此相似的组件之间传输数据。@kd啊，我明白了。您是否尝试过将
放置
数组放在第三个单独的模块中，并将第三个模块导入到您的
应用程序
和
子文件中？