Reactjs 如何在react中将一个组件的状态访问到另一个组件 import React，{Component}来自'React'； 类1扩展了React.Component { 构造函数（） { 超级（）； 此.state={ 电话：26 } } render（） { 返回( ); } } 导出默认值； 从“React”导入React，{Component}； 从“./one”导入一个 类。组件 { render（） { 返回( {1.state.number} ); } } 导出默认主页；

是否可以访问数字状态 有没有办法将一个组件的状态访问到另一个组件？ 如果有任何解决方案，请告诉我。

如前所述，尽管我想将其作为一个完整的答案

首先，我想让您知道，永远不要使用小写字母命名React组件。因此，请将组件命名为

One

，而不是

One

现在回到你的问题：- 不，这是不可能的，如果你的应用程序包含的组件很少，那么最好将

状态

对象作为

道具进行传递，但是如果你的应用程序包含的组件太多，那么最好使用可预测的状态容器，比如或而不是将状态作为道具进行传递

因此，您可以应用这些更改，我希望您将得到您想要的：-

一个组件：-

import React, { Component } from 'react';
class one extends React.Component 
{
    constructor()
    {
        super();
        this.state = {
            number:26
        }
    }
    render()
    {
        return(
            <div></div>
        );
    }
}
export default one;

import React, { Component } from 'react';
import one from './one'
class HomePage extends React.Component 
{
    render()
    {
        return(
            <div>{one.state.number}</div>
        );
    }
}
export default HomePage;

import React, { Component } from 'react';
import Homepage from './homepage';

class One extends React.Component 
{
    constructor()
    {
        super();
        this.state = {
            number:26
        }
    }
    render()
    {
        return(
            <Homepage data={this.state}/>
        );
    }
}

export default One;

import React，{Component}来自'React'；
从“./Homepage”导入主页；
类1扩展了React.Component
{
构造函数（）
{
超级（）；
此.state={
电话：26
}
}
render（）
{
返回(
);
}
}
导出默认值；

主页组件：-

import React, { Component } from 'react';
class one extends React.Component 
{
    constructor()
    {
        super();
        this.state = {
            number:26
        }
    }
    render()
    {
        return(
            <div></div>
        );
    }
}
export default one;

import React, { Component } from 'react';
import one from './one'
class HomePage extends React.Component 
{
    render()
    {
        return(
            <div>{one.state.number}</div>
        );
    }
}
export default HomePage;

import React, { Component } from 'react';
import Homepage from './homepage';

class One extends React.Component 
{
    constructor()
    {
        super();
        this.state = {
            number:26
        }
    }
    render()
    {
        return(
            <Homepage data={this.state}/>
        );
    }
}

export default One;

import React，{Component}来自'React'；
类。组件
{
render（）
{
log（“这是主页”，这是道具）；
返回(
{this.props.data.number}
);
}
}
导出默认主页；

如果有任何疑问，或者您发现其中有任何错误，请提出疑问。
否您无法访问另一个组件中某个组件的状态。状态对于React类是私有的。不过，您可以将状态提升到您想要使用它的组件，并将其作为道具传递给孩子（如果存在直接关系），否则您可能需要将其存储在全局存储中，如redux StoreThank、Vinit raj，但这里我称之为HomePage中的一个组件。正如您在上面所写的，在这种情况下，首先我必须调用一个组件，但我的主页是主页组件，因此我必须首先调用主页组件，而不是所有其他组件。您在主页组件中调用一个组件的唯一原因是访问其状态权限？？但这并不是我所遵循的正确方法，因此我可以更容易地将状态作为道具传递，因为这是唯一的方法，而不是使用redux或flux。实际上，我在这里所做的是，一个组件有5个状态，还有4-5个方法，所以在这里它使用自己的方法（使用onClick，onChange）更改状态值基于这一组件的价值，我正在主页中呈现一些其他组件，这就是我为什么要这样做。你能告诉我你在哪里呈现主页组件吗？即使你在一个组件中有很多方法，你可以访问一个人的状态的唯一方法是将其作为道具传递，所以，无论您在何处呈现主页组件，只要确保您传递一些包含一个人状态的道具就可以了。