Question

我不知道标题是否成功，但这是我的情况：

我有一个 ParentComponent ，它是一个游戏板。如果在上一个会话中用户正在玩，并且由于某种原因页面重新加载或其他原因，则服务器上存储了移动历史，以便将游戏板状态恢复到上一个会话状态。

要检查以前未完成的游戏，将在服务器上创建用户执行的第一个动作的 / unfinishedgames 节点，并用每个新的动作进行更新。游戏结束时，将从服务器上删除此节点，因此存在/ unfinished游戏的唯一方法是中断游戏。

现在，我想在每次创建ParentComponent时检查一个未完成的游戏，以提示用户是否要恢复它或开始一个新的游戏。我在我的componentDidMount（）内部执行此操作，以从服务器获取数据并检查/ unfinishedgame是否存在。如果不存在，则表示用户已经结束了之前的所有游戏；如果确实存在，则意味着我需要提示用户恢复它。

问题是，如果存在/ unfinishedgame，则在ParentComponent上调用render（）以便使用获取的信息来渲染木板之前，我找不到正确的位置提示用户输入信息。我的方法如下：

自从我在componentDidMount()上获取数据以来，请使用名为setState()的属性调用{pendingGameState: response.data}（正在获取获取的待处理游戏状态为response.data），并在回调时提示用户用户想要恢复游戏，并使用未决游戏中的数据更新ParentComponent状态
在componentDidMount()内用属性setState()调用{pendingGameState: response.data}，然后在render()内声明一个名为prompt的变量，该变量仅显示this.state.pendingGame不为空。

这两种方法如下：

1。

componentDidMount(){
    axios.get(/unfinishedGames)
    .then(response => {
        //if response is not null
        this.setState({
            pendingGameState:response.data
        })
    }, ()=>{
        // render a <UserPrompt> component to prompt the user, if user wants to resume then restore state to previous game's state
        this.setState({pendingGameState})
        })
}

2。

componentDidMount(){
    axios.get(/unfinishedGames)
    .then(response => {
        //if response is not null
        this.setState({
            pendingGameState:response.data
        });
//Inside render
const prompt = this.state.gamePendingState ? //if true, display a <UserPrompt> that prompts for input, if user wants to resume, update state with pendingGameState.

我已经尝试了两种方法，并且都有缺陷：

我没有在回调函数中呈现并显示<UserPrompt>（我也不知道是否可能）
如果采用这种方法，则必须从render /）内调用this.setState，这是不允许/最佳做法。

所以我的问题是这样的： 在为另一个组件的类函数调用render（）之前，是否可以在另一个组件的类函数中呈现组件？如果是这样，这怎么可能？此外，我还可以使用其他什么方法来实现这一目标？

我也尝试过从方法＃1的setState（）回调中返回一个匿名类组件，但是它也不显示任何内容。

作为响应，可以在调用render（）之前在另一个组件的类函数中渲染一个组件

0 个答案: