У меня есть следующий код:
// Packages
import React, { Component } from 'react';
import Web3 from 'web3';
import Header from './components/Header';
class App extends Component {
constructor(props) {
super(props);
this.state = {
account: null,
contract: null,
}
}
componentDidMount = () => {
if (typeof window.web3 !== 'undefined') {
this.state.web3.eth.getAccounts((err, accounts) => {
if(err)
throw err;
} else {
this.state.web3.eth.defaultAccount = accounts[0];
this.contract = new this.state.web3.eth.Contract(abi.abi, this.contractAddress);
this.setState({
account : accounts[0],
contract : this.contract
});
}
});
} else {
console.log('No web3? You should consider trying MetaMask!')
}
}
render() {
console.log(this.state);
return (
<div className="App">
<Header
account = {this.state.account}
web3={this.state.web3}
contract={this.state.contract}
/> </div>
);
}
}
export default App;
Я хочу, чтобы компонент Header повторно отображался, если setState завершен, и функция рендеринга вызывается с обновленным состоянием после функции setState в componentDidMount.
Если я вхожу в свой компонент Header, он вызывается только один раз, а реквизиты не обновляются ..
...
class Header extends React.Component {
constructor(props) {
super(props);
this.state = {
accountBalance: "-",
formattedAddress: '0x0...000',
account: '0x0'
}
}
componentDidMount(){
console.log('rendered');
}
...
Я абсолютно не понимаю, что может быть не так ..