Nft Minter Dapp - 无法铸造 nft

Question

我硬编码了一个 NFT-minter dApp。我尝试在 Polygon Mumbai 测试网上铸造它，但 NFT 似乎没有铸造。虽然交易成功并且我有交易哈希，但 NFT 并没有出现在钱包中。

谁能帮我解决这个问题吗？

我的智能合约代码 ->

// SPDX-License-Identifier: MIT

pragma solidity ^0.8.1;

import "@openzeppelin/contracts/token/ERC721/ERC721.sol";
import "@openzeppelin/contracts/access/Ownable.sol";

contract MyNFTCollection is ERC721, Ownable {
    uint256 public constant MAX_NFTS = 10;
    uint256 public constant PRICE = 0.01 ether;
    uint256 public nextTokenId = 1;

    constructor() ERC721("MyNFTCollection", "MYNFT") {}

    function mint() public payable {
        require(nextTokenId < MAX_NFTS, "Maximum number of NFTs minted");
        require(msg.value >= PRICE, "Not enough Ether sent");

        _safeMint(msg.sender, nextTokenId);
        nextTokenId++;
    }

    function withdraw() public onlyOwner {
        uint256 balance = address(this).balance;
        payable(msg.sender).transfer(balance);
    }

}

App.js 文件代码 ->

import React, { useState } from 'react';
import Web3 from 'web3';
import { Container, Row, Col, Button, Navbar } from 'react-bootstrap';
import 'bootstrap/dist/css/bootstrap.css';
import MyNFTCollection from './contract/MyNFTCollection.json';
import img1 from './images/1.png'
import './App.css';

function App() {

  const [web3, setWeb3] = useState(null);
  const [contract, setContract] = useState(null);
  const [account, setAccount] = useState("");
  const [tokenOwned, setTokenOwned] = useState([]);
  const [error, setError] = useState("");

  const connectWeb3 = async () => {
    try{
      if(window.ethereum){
        const web3 = new Web3(window.ethereum);
        //await window.ethereum.enable();
        await window.ethereum.request({ method: 'eth_requestAccounts' });
        setWeb3(web3);
        const contract = new web3.eth.Contract(
          MyNFTCollection.abi, "0xD5C6ba7fD9AB133d8CfCE96bF144B152C218B107"
        );
        setContract(contract);
        const accounts = await web3.eth.getAccounts();
        setAccount(accounts[0]);
        const tokenOwned = await contract.methods
          .tokenOfOwner(accounts[0])
          .call();
        setTokenOwned(tokenOwned);
      }else{
        setError("Please install Metamask!");
      }
    }catch(err) {
      console.error(err);
      setError("Failed to connect to Ethereum network!");
    }
  };

  const buyToken = async() => {
    try{
      const result = await contract.methods.mint().send({
        from: account,
        value: web3.utils.toWei("0.01", "ether"),
      });
      console.log(result);
      setTokenOwned([...tokenOwned, result]);
    }catch(err){
      console.error(err);
    }
  };

  if(!web3){
    return(
      <div className="connect-web3">
        <Button variant="primary" onClick={connectWeb3}>Connect to Ethereum Network</Button>
        {error && <p>{error}</p>}
      </div>
    );
  }

  return (
    <>
      <Navbar bg="dark" varient="dark">
        <Navbar .Brand>&nbsp; Moon Monkey NFT </Navbar .Brand>
        <Navbar .Text>{account}</Navbar .Text>
      </Navbar>
      <br/>
      <Container className="my-nft">
        <Row className="justify-content-center">
          <Col xs={12} md={8} lg={6}>
            <Row className="justify-content-center">
              {[1,2,3,4,5,6,7,8,9].map((tokenId) => (
                <Col xs={12} md={6} lg={4} key={tokenId}>
                  <div className="nft-card">
                    <img
                      src={img1}
                      alt={`NFT #${tokenId}.png`}
                      width={200}
                      style={{marginBottom: "10px"}}
                    />
                  </div>
                </Col>
              ))}
            </Row>
            <br/>
            <div className="text-center">
              <Button variant="success" onClick={buyToken}>Buy NFT</Button>
              <p className="mt-2">
                Cost: 0.01 MATIC
              </p>
              <p>
                You own {tokenOwned.length}/{10} NFTs.{" "}
              </p>
            </div>
          </Col>
        </Row>
      </Container>
    </>
  );
}

export default App;

Answer 1

虽然交易成功并且我有交易哈希，

如果您能够调用

mint()

交易， 并且已经完成了， 那么你已经成功铸造了这个NFT。 NFT 的数据在链上。

NFT 没有出现在钱包中。

这与铸币交易是否成功是一个单独的问题。 这是因为 EVM 兼容的钱包不 （并且不可能） 了解您感兴趣的每个代币的地址。 它可能知道一些非常流行/默认建立的常见的， 但不是任何全新的， 尤其是您刚刚部署的。

如果您使用 MetaMask 浏览器扩展程序， 看看这篇文章

（选择“扩展”，然后选择“手动添加 NFT”）

然后您将看到有关如何导入 NFT 的分步说明 使用新智能合约的部署地址。 其他钱包也遵循类似的模式。

Answer 2

您可以通过其他网站使用List或mint nft或检查它们是否出现在Dapp中并尝试导入