使用 web3 从智能合约发送资金的输入和按钮最简单和最短的方法是什么?
What is the easiest and shortest way to have an input and button to send money from smart contract with web3?
我试图在前端有一个输入字段,之后有一个按钮,用于从用户向智能合约发送资金。
这是我的链上合约:https://snowtrace.io/address/0x98608c1e3ae104e7a11ea2879b44669a1c38b73d
这是我的 html 代码:
<!DOCTYPE html>
<html>
<head>
<title>Send Money</title>
<script src='node_modules/web3/dist/web3.min.js'></script>
</head>
<body>
<input type="Amount">
<button onclick="getFunds();">Send Money</button>
<script type="text/javascript" src="index.js"></script>
</body>
</html>
这是我的 index.js:
// Check metamask installation and connect to site
async function loadWeb3() {
if (window.ethereum) {
window.web3 = new Web3(window.ethereum);
window.ethereum.enable();
}
}
// This function links to the smart contract for interactions
async function loadContract() {
return await new window.web3.eth.Contract([{"inputs": [],"payable":false,"stateMutability":"nonpayable","type":"constructor"},{"constant":false,"inputs":[{"internalType":"address payable","name":"_liquitdateTo","type":"address"}],"name":"destroySmartContract","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"fundsReceived","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"getCurrentBalance","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[],"name":"getFunds","outputs":[],"payable":true,"stateMutability":"payable","type":"function"},{"constant":false,"inputs":[{"internalType":"bool","name":"_bool","type":"bool"}],"name":"pause","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"paused","outputs":[{"internalType":"bool","name":"","type":"bool"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"smartContractAddress","outputs":[{"internalType":"address","name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"tresury","outputs":[{"internalType":"address payable","name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"}], '0x98608C1e3ae104E7A11EA2879b44669a1c38b73D');
}
// This is the main program function that calls all the previous ones
async function load() {
await loadWeb3();
window.contract = await loadContract();
}
async function getFunds() {
const getFunds = await window.contract.methods.getFunds().send({ from: ""});
} // How do I complete this function so that it recognizes the amount to send from the input field in the index.html and that it also fills in the from: "" automatically?
如何修改代码,让用户只需填写输入的金额并单击发送按钮即可发送资金?
我找到的最简单的解决方案如下:
在 html 文件正文中插入:
<input id="amount" step="0.01" type="number" placeholder="AVAX Amount...." ref="input" required>
<button onclick="getFunds();">Deposit</button>
在 index.js 函数中插入以下内容以汇款:
async function getFunds() {
const accounts = await ethereum.request({ method: 'eth_accounts' });
console.log(accounts[0]);
let amount = await document.getElementById("amount").value;
amount = amount * 10**18;
console.log(amount);
const getFunds = await window.contract.methods.getFunds().send({value: amount, from: accounts[0]});
}
这很好用。请确保您有足够的资金进行交易。
我试图在前端有一个输入字段,之后有一个按钮,用于从用户向智能合约发送资金。
这是我的链上合约:https://snowtrace.io/address/0x98608c1e3ae104e7a11ea2879b44669a1c38b73d
这是我的 html 代码:
<!DOCTYPE html>
<html>
<head>
<title>Send Money</title>
<script src='node_modules/web3/dist/web3.min.js'></script>
</head>
<body>
<input type="Amount">
<button onclick="getFunds();">Send Money</button>
<script type="text/javascript" src="index.js"></script>
</body>
</html>
这是我的 index.js:
// Check metamask installation and connect to site
async function loadWeb3() {
if (window.ethereum) {
window.web3 = new Web3(window.ethereum);
window.ethereum.enable();
}
}
// This function links to the smart contract for interactions
async function loadContract() {
return await new window.web3.eth.Contract([{"inputs": [],"payable":false,"stateMutability":"nonpayable","type":"constructor"},{"constant":false,"inputs":[{"internalType":"address payable","name":"_liquitdateTo","type":"address"}],"name":"destroySmartContract","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"fundsReceived","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"getCurrentBalance","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[],"name":"getFunds","outputs":[],"payable":true,"stateMutability":"payable","type":"function"},{"constant":false,"inputs":[{"internalType":"bool","name":"_bool","type":"bool"}],"name":"pause","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"paused","outputs":[{"internalType":"bool","name":"","type":"bool"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"smartContractAddress","outputs":[{"internalType":"address","name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"tresury","outputs":[{"internalType":"address payable","name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"}], '0x98608C1e3ae104E7A11EA2879b44669a1c38b73D');
}
// This is the main program function that calls all the previous ones
async function load() {
await loadWeb3();
window.contract = await loadContract();
}
async function getFunds() {
const getFunds = await window.contract.methods.getFunds().send({ from: ""});
} // How do I complete this function so that it recognizes the amount to send from the input field in the index.html and that it also fills in the from: "" automatically?
如何修改代码,让用户只需填写输入的金额并单击发送按钮即可发送资金?
我找到的最简单的解决方案如下:
在 html 文件正文中插入:
<input id="amount" step="0.01" type="number" placeholder="AVAX Amount...." ref="input" required>
<button onclick="getFunds();">Deposit</button>
在 index.js 函数中插入以下内容以汇款:
async function getFunds() {
const accounts = await ethereum.request({ method: 'eth_accounts' });
console.log(accounts[0]);
let amount = await document.getElementById("amount").value;
amount = amount * 10**18;
console.log(amount);
const getFunds = await window.contract.methods.getFunds().send({value: amount, from: accounts[0]});
}
这很好用。请确保您有足够的资金进行交易。