Question

因为我需要在react的渲染器中访问indexeddb，所以我使用promise并分离了渲染器中的逻辑。

render(){
  if(original_flow) dispatch(applyUserAccFilters(groups));
  //access indexeddb
  else applyShopNameFilters(window,groups).then((
       ()=>{groupListItems=[];groupListItems.length=0;                    
            //generate UI in groupListItems
            //if I change groupListItems to be [], callback's called but empty UI is not rendered
            dispatch(genGroupList(groups,groupListItems));
            return this.paintUI(groupListItems);}),()=>{}
      );
  //original flow; this flow can work normally; render of this flow is normal
  dispatch(genGroupList(groups,groupListItems));
  return this.paintUI(groupListItems);

}

由于我遇到了一个反应，要求我将返回结果放在渲染底部，所以我不禁要问，回调中是否有任何渲染不合法？

我确实需要在解锁IO的回调中进行渲染；任何想法都欢迎。

Answer 1

从问题中可用的上下文中，我的答案将是：

几乎总是不想在render方法中执行任何异步操作。
React提供了一组生命周期方法来解决此问题。在您的情况下，取决于您希望何时执行异步方法，将使用以下内容：
1. ComponentDidMount（如果您希望您的方法在React加载相应的组件后立即执行）
2. 在ShouldComponentUpdate中指定更新规则，并在ComponentDidUpdate中执行异步功能；如果您有需要通过Async方法处理的“实时”数据。

在异步函数内部，使用this.setState({key: value})模式将异步函数的结果设置为状态。在render方法中，您应该使用相应的状态变量。在理想情况下，这是React中健康的编码方式。

如何实现诺言的决心

1 个答案: