在 setVariables 之后反应中继挂起的变量总是为空

Posted 2023-03-08

【中文标题】在 setVariables 之后反应中继挂起的变量总是为空

【英文标题】：React relay pendingVariables always null after setVariables

【发布时间】：2017-04-04 16:01:45

【问题描述】：

当我尝试设置变量时，组件仅在获取完成后更新。这是一个示例代码。

class RelayExample extends React.Component 
  setVars() 
    this.props.relay.setVariables(id: '2');
  ;
  render() 
    console.log(this.props.relay.pendingVariables);
    return (
      <div>
        <button onClick=this.setVars.bind(this)>set variable</button>
      </div>
    );
  


RelayExample = Relay.createContainer(RelayExample, 
  initialVariables: 
    id: '1'
  ,
  fragments: 
    userStore: ()=> 
      return Relay.QL`
      fragment on userStore 
         user(id:$id)
          email
         
      
      `;
    
  
);

ReactDOM.render(
  <Relay.RootContainer Component=RelayExample route=new TestQuery()/>,
    document.getElementById('app')
);

当我按下按钮时，我会在控制台中得到以下结果：

即使我在 setVariables 函数之后立即使用 forceUpdate，我也会得到类似的结果。

setVars() 
        this.props.relay.setVariables(id: '2');
        this.forceUpdate();
;

【问题讨论】：

环境为Relay.Store

【参考方案1】：

我相信这是预期的行为。

pendingVariables 包含一组变量，用于 获取新的道具，即当 this.props.relay.setVariables() 或 this.props.relay.forceFetch() 被调用和对应的请求 正在飞行中。

如果没有请求在进行中，pendingVariables 为空。

如果您在设置变量后立即控制台日志，您应该在pendingVariables 中看到它们。

【讨论】：

如果我没记错的话，根据this 示例，组件必须在 setVariables 之后更新，并且必须满足 pendingVariables。

这不是有意的行为。这里有同样的问题。