6.DApp-用Web3实现前端与智能合约的交互

题记

        用Web3实现前端与智能合约的交互,以下是操作流程和代码。

准备ganache环境

        文章地址:4.DApp-MetaMask怎么连接本地Ganache-CSDN博客 

准备智能合约 

        文章地址: 2.DApp-编写和运行solidity智能合约-CSDN博客

编写index.html文件

        

    Name Contract Demo

   

   

   

   

设置姓名

   

   

   

   

   

   

   




    Name Contract Demo
    
    
    


    

设置姓名



执行程序 

       使用vscode的Live Server打开网页

       参考这篇文章的执行方法:1.Vue-在独立页面实现Vue的增删改查-CSDN博客 

展示图 

6.DApp-用Web3实现前端与智能合约的交互_第1张图片

发起交易 

6.DApp-用Web3实现前端与智能合约的交互_第2张图片

完成交易 

6.DApp-用Web3实现前端与智能合约的交互_第3张图片

6.DApp-用Web3实现前端与智能合约的交互_第4张图片 后记

        觉得有用可以点赞或收藏!

你可能感兴趣的:(DApp,web3,智能合约,交互,区块链,开发语言,javascript,后端)