Javascript 如何从React中的其他组件访问数据

App.js

从“React”导入React；
从“./components/LoginGuestButton”导入LoginGuestButton，{getGuestValue}；
函数App（）{
返回(
//如果用户不是来宾用户，则显示登录页面
（！getGuestValue）和(
)
);
}
导出默认应用程序；

LoginGuestButton.js

import React from 'react';
import LoginGuestButton, {getGuestValue} from './components/LoginGuestButton';

function App() {
  return (
    //If User is not a guest user, then display the login page
    (!getGuestValue) && (
    <LoginGuestButton/>
    )
  );
}

export default App;

从“React”导入React；
var guestValue=假；
const LoginGuestButton=（）=>{
函数开关GuestValue（）{
guestValue=true；
}
返回(
以演示用户身份登录
)
}
导出常量getGuestValue=（）=>{
返回(
顾客价值
);
}
导出默认登录按钮

这是我的第一个React应用程序，我正在构建一个简单的登录屏幕。当用户单击“以来宾身份登录”按钮时，我想清除屏幕并开始向用户显示示例数据。为此，我需要获取一个“signed-In”布尔值，在按下“sign-In as-guest”按钮后，该布尔值应设置为true

我介绍的代码不起作用。由于某些原因，app.js不知道getGuestValue。 上面的代码不显示任何错误消息。我遵循了问题中给出的细节：

但这对我不起作用

有人请帮忙。

欢迎，请阅读。如果你从头到尾地阅读，你的生活会变得轻松得多。由于这是您的第一个React应用程序，请仅阅读主要概念部分和挂钩部分。创建几个应用程序后，请返回并阅读高级指南部分

---

在回答你的问题之前，我必须解释道具和React的基本原理是如何工作的，这远远超出了Stackoverflow问答格式的范围。如果您阅读了文档，仍然无法找到问题的答案，请对此答案进行评论，我将帮助您。

谢谢！我仔细阅读了文档，找到了解决问题的方法。你应该将答案标记为已接受，这样人们就会知道你不再寻找答案了

import React from 'react';

var guestValue = false;

const LoginGuestButton = () => {
    function switchGuestValue() {
        guestValue = true;
    }

    return (
        <button className="btn btn-lg btn-primary btn-block" onClick = {switchGuestValue}>
        Sign in as Demo User
        </button>
      )

}

export const getGuestValue = () => {        
    return (
      guestValue
    );
}
export default LoginGuestButton