0

来源：https ://betterprogramming.pub/blockchain-introduction-using-real-world-dapp-react-solidity-web3-js-5464714​​19955

首先创建一个配置文件，其中包含

export const CONTACT_ADDRESS = "0xfAd567EBdCb36f49F3a509FEDF9e72E3ad75ca59";
export const CONTACT_ABI = [{
    constant: true,
    inputs: [],
    name: "count"
}......]

app.js 文件看起来像这样

import { useEffect, useState } from "react";
import Web3 from "web3";
import { CONTACT_ABI, CONTACT_ADDRESS } from "./config/config";

function App() {
  const [account, setAccount] = useState();
  const [contactList, setContactList] = useState();
  const [contacts, setContacts] = useState([]);

  useEffect(() => {
    async function load() {
      const web3 = new Web3(Web3.givenProvider || "http://localhost:7545");

      const accounts = await web3.eth.requestAccounts();
      setAccount(accounts[0]);

      const contactList = new web3.eth.Contract(CONTACT_ABI, CONTACT_ADDRESS);

      setContactList(contactList);

      const counter = await contactList.methods.count().call();

      for (var i = 1; i <= counter; i++) {
        const contact = await contactList.methods.contacts(i).call();
        setContacts((contacts) => [...contacts, contact]);
      }
    }

    load();
  }, []);

  return (
    <div>
      Your account is: {account}
      <h1>Contacts</h1>
      <ul>
        {Object.keys(contacts).map((contact, index) => (
          <li key={`${contacts[index].name}-${index}`}>
            <h4>{contacts[index].name}</h4>
            <span>
              <b>Phone: </b>
              {contacts[index].phone}
            </span>
          </li>
        ))}
      </ul>
    </div>
  );
}

export default App;

运行时，我收到以下错误。我不确定配置文件是否导致此错误如果是，我该如何解决？

index.js:297 Uncaught (in promise) Error: Returned values aren't valid, did it run Out of Gas? You might also see this error if you are not using the correct ABI for the contract you are retrieving data from, requesting data from a block number that does not exist, or querying a node that is not fully synced.
    at ABICoder.push../node_modules/web3-eth-abi/lib/index.js.ABICoder.decodeParametersWith (index.js:297:1)
    at ABICoder.push../node_modules/web3-eth-abi/lib/index.js.ABICoder.decodeParameters (index.js:284:1)
    at Contract.push../node_modules/web3-eth-contract/lib/index.js.Contract._decodeMethodReturn (index.js:481:1)
    at Method.outputFormatter (index.js:788:1)
    at Method.push../node_modules/web3-core-method/lib/index.js.Method.formatOutput (index.js:147:1)
    at sendTxCallback (index.js:530:1)
    at cb (util.js:689:1)
    at Item.push../node_modules/process/browser.js.Item.run (browser.js:153:1)
    at drainQueue (browser.js:123:1)

认为contact_address不正确，但不确定我从哪里选择正确的。基本上我如何构建配置文件。

4

0 回答 0