#javascript #ethereum #web3 #web3js #metamask
Вопрос:
Я работаю над компонентом кнопки, который обрабатывает подключение пользователя к его кошельку Metamask. Идея заключается в том, что если кошелек пользователя еще не подключен, то на кнопке отобразится «Подключить кошелек», как только они нажмут на кнопку и подключат свой кошелек, текст кнопки изменится и вместо этого отобразится адрес их учетной записи » 0x323..».
Единственное, с чем у меня пока возникают проблемы, — это изменение состояния переменной учетных записей и попытка извлечь из нее адрес. На данный момент все, что я могу сделать, это войти в Metamask, но после подключения адрес не отображается, потому что он не заметил, что состояние переменной учетных записей изменилось. Я пробовал разные варианты, пытаясь обновить состояние учетных записей, но, похоже, ничего не сработало. Есть ли что-то, что я должен изменить или включить в свой код?
let ethereum = window.ethereum;
let accounts = [];
// Renders a Button to handle the Metamask Connection
class WalletConnector extends React.Component {
constructor(props){
super(props);
this.state = {
// set state of account to empty if not connected to a wallet
accounts: ''
}
}
handleClick(){
try{
// prompts to connect to metamask
ethereum.request({ method: 'eth_requestAccounts' });
// * this did not work *
//this.setState({accounts: ethereum.request({ method: 'eth_requestAccounts' })});
}
catch(error){
// if user cancels metamask request
if (error.code === 4001){
console.log('Metamask Connection Cancelled');
}
else {
// if unable to requst account prompt to install metamask
alert('Install Metamask to Connect');
}
}
}
render(){
return(
<div>
<button onClick={this.handleClick}>
{/* if account is connected display address else ask to connect */}
{this.state.accounts === '' ? 'Connect Wallet' : this.state.accounts}
</button>
</div>
);
}
}
Ответ №1:
Вам нужно использовать асинхронное/ожидание. ethereum.request
вернул бы обещание.
async function handleClick() {
try {
// prompts to connect to metamask
await ethereum.request({ method: "eth_requestAccounts" });
this.setState({
accounts: await ethereum.request({ method: "eth_requestAccounts" }),
});
} catch (error) {
// if user cancels metamask request
if (error.code === 4001) {
console.log("Metamask Connection Cancelled");
} else {
// if unable to requst account prompt to install metamask
alert("Install Metamask to Connect");
}
}
}