Blockchain contract.set不是一个函数

我正在学习以太坊的开发，我下载了react truffle套装，然后尝试更改一些代码，将字符串插入区块链，然后进行回显。 但是我有一个错误，上面写着：未处理的拒绝（TypeError）：contract.set不是一个函数

App.js:

import React, { Component } from "react";
import SimpleStorageContract from "./contracts/SimpleStorage.json";
import getWeb3 from "./getWeb3";

import "./App.css";

class App extends Component {
  state = { storageValue: "", web3: null, accounts: null, contract: null, newValue: "" };

  componentDidMount = async () => {
    try {
      this.handleChange = this.handleChange.bind(this);
      this.handleSubmit = this.handleSubmit.bind(this);
      // Get network provider and web3 instance.
      const web3 = await getWeb3();

      // Use web3 to get the user's accounts.
      const accounts = await web3.eth.getAccounts();

      // Get the contract instance.
      const networkId = await web3.eth.net.getId();
      const deployedNetwork = SimpleStorageContract.networks[networkId];
      const instance = new web3.eth.Contract(
        SimpleStorageContract.abi,
        deployedNetwork && deployedNetwork.address,
      );

      // Set web3, accounts, and contract to the state, and then proceed with an
      // example of interacting with the contract's methods.
      this.setState({ web3, accounts, contract: instance }, this.runExample);
    } catch (error) {
      // Catch any errors for any of the above operations.
      alert(
        `Failed to load web3, accounts, or contract. Check console for details.`,
      );
      console.error(error);
    }
  };

  handleChange(event) {
    this.setState({newValue: event.target.value });
  }

  async handleSubmit(event) {
    event.preventDefault();

    const { accounts, contract } = this.state;
    await contract.set(this.state.newValue, {from: accounts[0]});
    const response = await contract.get();
    this.setState({storageValue: response });
  }

  runExample = async () => {
    const { contract } = this.state;

    // Get the value from the contract to prove it worked.
    const response = await contract.methods.get().call();

    // Update state with the result.
    this.setState({ storageValue: response });
  };

  render() {
    if (!this.state.web3) {
      return <div>Loading Web3, accounts, and contract...</div>;
    }
    return (
      <div className="App">
        <h1>Sample</h1>
        <div>Text: {this.state.storageValue}</div>
        <form onSubmit={this.handleSubmit}>
          <input type="text" value={this.state.newValue} onChange={this.handleChange.bind(this)}></input>
          <input type="submit" value="Submit"></input>
        </form>
      </div>
    );
  }
}

export default App;

// SPDX-License-Identifier: MIT
pragma solidity >=0.4.21 <0.7.0;

contract SimpleStorage {
    string storedData;

    constructor(string memory x) public {
      storedData = x;
    }

    function set(string memory x) public {
        storedData = x;
    }

    function get() public view returns (string memory) {
        return storedData;
    }
}

import React，{Component}来自“React”；
从“/contracts/simplestrage.json”导入SimpleStrageContract；
从“/getWeb3”导入getWeb3；
导入“/App.css”；
类应用程序扩展组件{
state={storageValue:，web3:null，accounts:null，contract:null，newValue:：}；
componentDidMount=async（）=>{
试一试{
this.handleChange=this.handleChange.bind（this）；
this.handleSubmit=this.handleSubmit.bind（this）；
//获取网络提供商和web3实例。
const web3=等待getWeb3（）；
//使用web3获取用户的帐户。
const accounts=wait web3.eth.getAccounts（）；
//获取合同实例。
const networkId=wait web3.eth.net.getId（）；
const deployedNetwork=simplestragecontract.networks[networkId]；
const instance=new web3.eth.Contract(
SimpleStrageContract.abi，
deployedNetwork&&deployedNetwork.address，
);
//将web3、accounts和contract设置为state，然后继续
//与合同方法交互的示例。
this.setState（{web3，accounts，contract:instance}，this.runExample）；
}捕获（错误）{
//捕获上述任何操作的任何错误。
警觉的(
`未能加载web3、帐户或合同。有关详细信息，请检查控制台。`，
);
控制台错误（error）；
}
};
手变（活动）{
this.setState（{newValue:event.target.value}）；
}
异步handleSubmit（事件）{
event.preventDefault（）；
const{accounts，contract}=this.state；
wait contract.set（this.state.newValue，{from:accounts[0]}）；
const response=wait contract.get（）；
this.setState（{storageValue:response}）；
}
runExample=async（）=>{
const{contract}=this.state；
//从合同中获取价值，以证明其有效。
const response=await contract.methods.get（）.call（）；
//使用结果更新状态。
this.setState（{storageValue:response}）；
};
render（）{
如果（！this.state.web3）{
返回加载Web3、帐户和合同。。。；
}
返回(
样品
文本：{this.state.storageValue}
);
}
}
导出默认应用程序；

以下是声明set函数的合同：

SimpleStorage.sol:

import React, { Component } from "react";
import SimpleStorageContract from "./contracts/SimpleStorage.json";
import getWeb3 from "./getWeb3";

import "./App.css";

class App extends Component {
  state = { storageValue: "", web3: null, accounts: null, contract: null, newValue: "" };

  componentDidMount = async () => {
    try {
      this.handleChange = this.handleChange.bind(this);
      this.handleSubmit = this.handleSubmit.bind(this);
      // Get network provider and web3 instance.
      const web3 = await getWeb3();

      // Use web3 to get the user's accounts.
      const accounts = await web3.eth.getAccounts();

      // Get the contract instance.
      const networkId = await web3.eth.net.getId();
      const deployedNetwork = SimpleStorageContract.networks[networkId];
      const instance = new web3.eth.Contract(
        SimpleStorageContract.abi,
        deployedNetwork && deployedNetwork.address,
      );

      // Set web3, accounts, and contract to the state, and then proceed with an
      // example of interacting with the contract's methods.
      this.setState({ web3, accounts, contract: instance }, this.runExample);
    } catch (error) {
      // Catch any errors for any of the above operations.
      alert(
        `Failed to load web3, accounts, or contract. Check console for details.`,
      );
      console.error(error);
    }
  };

  handleChange(event) {
    this.setState({newValue: event.target.value });
  }

  async handleSubmit(event) {
    event.preventDefault();

    const { accounts, contract } = this.state;
    await contract.set(this.state.newValue, {from: accounts[0]});
    const response = await contract.get();
    this.setState({storageValue: response });
  }

  runExample = async () => {
    const { contract } = this.state;

    // Get the value from the contract to prove it worked.
    const response = await contract.methods.get().call();

    // Update state with the result.
    this.setState({ storageValue: response });
  };

  render() {
    if (!this.state.web3) {
      return <div>Loading Web3, accounts, and contract...</div>;
    }
    return (
      <div className="App">
        <h1>Sample</h1>
        <div>Text: {this.state.storageValue}</div>
        <form onSubmit={this.handleSubmit}>
          <input type="text" value={this.state.newValue} onChange={this.handleChange.bind(this)}></input>
          <input type="submit" value="Submit"></input>
        </form>
      </div>
    );
  }
}

export default App;

// SPDX-License-Identifier: MIT
pragma solidity >=0.4.21 <0.7.0;

contract SimpleStorage {
    string storedData;

    constructor(string memory x) public {
      storedData = x;
    }

    function set(string memory x) public {
        storedData = x;
    }

    function get() public view returns (string memory) {
        return storedData;
    }
}

//SPDX许可证标识符：MIT
pragma solidity>=0.4.21代码中的这一行使用包的语法：

但是您的代码只导入（而不是块菌），并且似乎在其他地方正确使用了它

在web3js中，您需要使用
合同
对象的
方法
属性（与您在
合同.methods.get（）
中使用的属性相同）。以及
send（）
函数（该函数使用
from
属性接受对象），以发送事务而不是调用

应该如此

await contract.methods.set(this.state.newValue).send({from: accounts[0]});

注意：Web3js和Truffle是两个独立的包，彼此不相关。但两者都可以用来与智能合约互动