Last active
January 7, 2022 16:41
-
-
Save Shih-Yu/f523d6b9b83974a38a780ba8e74be745 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useState } from "react"; | |
import './App.css'; | |
import Web3 from "web3"; | |
import NumberChanger from "./build/NumberChanger.json"; | |
const contractAddress = "0x7c2481b87100844E11df966BcCD55E82A138Fe84"; | |
function App() { | |
const web3 = new Web3("http://localhost:8545"); | |
let contract = new web3.eth.Contract(NumberChanger.abi, contractAddress); | |
async function getNumber() { | |
try { | |
const getStateNumber = await contract.methods.getNumber().call(); | |
setNewNumber(getStateNumber); | |
} catch (error) { | |
console.log("Error:", error); | |
} | |
} | |
async function changeNumber() { | |
// Assign array of accounts into getAccount variable | |
let getAccount = await web3.eth.getAccounts(); | |
// Calling setNumber function and using first account to send transaction | |
await contract.methods.setNumber(number).send({ from: getAccount[0] }); | |
// Resets input and h3 to blank | |
setNewNumber(""); | |
} | |
return ( | |
<div className="App"> | |
<header className="App-header"> | |
<h1>Welcome to Number Changer</h1> | |
<h3>Your new number:</h3> | |
<input /> | |
<button>Get Number</button> | |
<button>Set Number</button> | |
</header> | |
</div> | |
); | |
} | |
export default App; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment