在渲染组件之前获取信息但无法使用 getInitialProps ReactJS答案

【问题标题】：Getting information before Component is rendered but cannot use getInitialProps ReactJS在渲染组件之前获取信息但无法使用 getInitialProps ReactJS
【发布时间】：2018-08-14 04:51:58
【问题描述】：

我在下面有一些代码。在元掩码注入 web3 之后但在渲染之前，我需要通过调用获取信息，但我不能使用 getInitialProps，因为它会因为服务器端渲染而失败。不太清楚如何设计。

class CampaignIndex extends Component {

async componentDidMount() {
    const accounts = await web3.eth.getAccounts();
    const campaigns = await factory.methods
    .getCampaigns("0x0000000000000000000000000000000000000000", 0)
    .call({
        from: accounts[0]
    });

    console.log(campaigns["completedCampaigns"]);
    console.log(campaigns["ongoingCampaigns"]);

    return { campaigns };
}

render() {
    return <div>{this.props.campaigns["completedCampaigns"][0]}</div>
 }
}

export default CampaignIndex;

错误：TypeError：无法读取未定义的属性“completedCampaigns”

【问题讨论】：

标签： reactjs web3

【解决方案1】：

我认为使用setState 会更好。您使用 props 的方式不正确。

async componentDidMount() {
 const accounts = await web3.eth.getAccounts();
 const campaigns = await factory.methods
 .getCampaigns("0x0000000000000000000000000000000000000000", 0)
 .call({
    from: accounts[0]
 });

 console.log(campaigns["completedCampaigns"]);
 console.log(campaigns["ongoingCampaigns"]);

 this.setState({
   campaigns:campaigns
 })
}

render() {
 return <div>{this.state.campaigns["completedCampaigns"][0]}</div>
}

【讨论】：