Как получить доступ к функции контракта ethereum, используя web3 в javascript? - PullRequest
Новая
       105

Как получить доступ к функции контракта ethereum, используя web3 в javascript?

0 голосов
/ 26 февраля 2019

Я написал простой привет мир!умный контракт и развернут с использованием testrpc и трюфель.У меня есть функция в контракте, которая возвращает значение, и я использую эту функцию и значение, которое она возвращает, чтобы отобразить значение на веб-странице с использованием кода кода реакции и java-кода. Коды ниже

1.Greeter.sol 

pragma solidity ^0.5.0;
contract Greeter{
    string greeting;
    function greeter(string memory _greeting) public{
        greeting = _greeting;
    }

    function greet()public view returns(string memory){
        return greeting;
    }
}

2.EthereumSetup.js 

import Web3 from 'web3';
    const web3 = new Web3( new Web3.providers.HttpProvider("https://localhost:8545"));
    let greeterABI = [ { constant: false,
        inputs: [ [Object] ],
        name: 'greeter',
        outputs: [],
        payable: false,
        stateMutability: 'nonpayable',
        type: 'function',
        signature: '0xfaf27bca' },
      { constant: true,
        inputs: [],
        name: 'greet',
        outputs: [ [Object] ],
        payable: false,
        stateMutability: 'view',
        type: 'function',
        signature: '0xcfae3217' } ];
    let greeterAddress = '0x52F2Ce3bB739567a05AA4eA36720028946c46C5f';
    const greeterContract = web3.eth.Contract(greeterABI,greeterAddress);

    export{greeterContract};

3.App.js 

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import {greeterContract} from './EthereumSetup';
import Web3 from 'web3'
class App extends Component {
  constructor(props){
    super(props)
    this.state={
      greeting: ""
    }
  }
 async componentWillMount(){

      var data =await greeterContract.methods.greet().call()

    this.setState({
      greeting: String(data)
    })

  }
  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <p>
            Edit <code>src/App.js</code> and save to reload.
            <h2>"{this.state.greeting}"</h2>
          </p>
          <a
            className="App-link"
            href="https://reactjs.org"
            target="_blank"
            rel="noopener noreferrer"
          >
            Learn React
          </a>
        </header>
      </div>
    );
  }
}

export default App;

У меня запущен testrpc, и npn начинает загружать веб-страницу, все нормально, я открыл консоль трюфеля идал команды для установки значения переменной и даже вызвал greet () (функция, которая возвращает значение), его изображение здесь Изображение консоли трюфеля

Перед вызовом функции greeter со значением для установки iне получайте ничего подобного значению переменной до присвоения значения

Я знаю, что есть ошибка в componentWillMount () файла App.js, из-за которой моя веб-страница пуста.Пожалуйста, помогите мне в этом отношении, и я знаю, что testrpc довольно устарел

...