Redux存储和毛毛雨事件了解其运作方式

问题描述

我是新来的反应者和还原者，但是我对JavaScript感到满意。我的目标是能够构建DAPP。

这没问题，我的代码按预期工作，这篇文章纯粹是关于了解我的代码在做什么，尤其是应用程序的状态。我希望能够了解每一行的内容，因此可以重用此功能。

尽管有关于redux的细心文档，细雨和做出反应，并且尽管这段代码包含注释，但我仍然很难理解。

此代码取自https://www.trufflesuite.com/tutorials/getting-started-with-drizzle-and-react

App.js

import React,{Component} from 'react';
import ReadString from "./ReadString";
import SetString from "./SetString";
class App extends Component {
  state = { loading: true,drizzleState: null };

  componentDidMount() {
    const { drizzle } = this.props;


    // subscribe to changes in the store
    this.unsubscribe = drizzle.store.subscribe(() => {

      // every time the store updates,grab the state from drizzle
      const drizzleState = drizzle.store.getState();

      // check to see if it's ready,if so,update local component state
      if (drizzleState.drizzleStatus.initialized) {
        this.setState({ loading: false,drizzleState });
      }
    });
  }

  componentwillUnmount() {
    this.unsubscribe();
  }

  render() {
    if (this.state.loading) return "Loading Drizzle...";
    return( 
      <div className="App">
        <ReadString 
          drizzle ={this.props.drizzle}
          drizzleState={this.state.drizzleState}
        />

        <SetString 
          drizzle ={this.props.drizzle}
          drizzleState={this.state.drizzleState}
        />
      </div>);
  }
}

export default App;

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）