Используйте Web3 и Метамаску в React - PullRequest
Новая
       13

Используйте Web3 и Метамаску в React

0 голосов
/ 13 марта 2019

Я пытаюсь создать свой первый dapp с помощью React.Я не могу понять, как подключить Web3.js к React и как правильно его использовать.Вы можете показать, как это сделать правильно?Может быть, я должен использовать государство.Спасибо! 

 import React, { Component } from 'react';
 import Web3 from 'web3';
 import ABI from './web3/ABI'

    class App extends Component {

        web3Connection = () => {
                let web3
                if (window.ethereum) {
                    web3 = new Web3(window.ethereum);
                    try {
                        window.ethereum.enable().then(function() {});
                    } catch (e) {}
                } else if (window.web3) {
                    web3 = new Web3(web3.currentProvider);
                } else {
                    alert('You have to install MetaMask !');
                }

                web3.eth.defaultAccount = web3.eth.accounts[0];


                const EthereumNoteContract = web3.eth.contract(ABI);

                const EthereumNote = EthereumNoteContract.at('address');

            }

        addMyNote = (_text) => {
                EthereumNote.addMyNote(_text, { value: 0 }, function(error, result) {
                    if (error) console.log(error);
                    else console.log(result)
                });
            }

        render() {

            return (
                <div>
                {this.web3Connection}
                <button onClick={this.addMyNote}>Send</button>
                </div>
            )
        }
    }

1 Ответ

1 голос
/ 13 марта 2019

Предполагается, что у вас установлено расширение metamask chrome и вы вошли в систему ... Также предполагается, что вы установили web3 lib ...

Вот, пожалуйста, 

import React from 'react';
import Web3 from 'web3'

export default class App extends React.Component {
  state = {account: ''}

  async loadBlockChain() {
    const web3 = new Web3(Web3.givenProvider || 'http://localhost:8080')
    const network = await web3.eth.net.getNetworkType();
    console.log(network) // should give you main if you're connected to the main network via metamask...
    const accounts = await web3.eth.getAccounts()
    this.setState({account: accounts[0]})
  }

  componentDidMount() {
    this.loadBlockChain()
  }
  render() {
    return (
      <div>
        <p>Check out the the console....</p>
        <p>Your account: {this.state.account}</p>
      </div>
    );
  }
}
...