web3智能合约dapp-调用私有链合约

1. 安装web3，然后与私有链的合约进行交互

npm install web3

安装成功就可以用web3连接本地私有链

2. 初始化web3

init(){
    //本地私有网络地址
    let host = "http://127.0.0.1:8545"
    //创建providers
    const httpprovi = new Web3.providers.HttpProvider(host)
    this.web3 = new Web3( httpprovi)
},

初始化之后就能通过this.web3这个对象操作内置的一些方法，操作手册可以参考cw.hubwiz.com/card/c/web3…

前一章节我们创建的token合约这个时候就可以用到了

合约地址：0xe78A0F7E598Cc8b0Bb87894B0F60dD2a88d6a8Ab

3. 连接合约引入ABI，abi就是合约能操作的方法，ABI在哪里获取，在remix-ide编译合约的时候就能找到对应的abi

复制好的ABI，在目录assets里面创建abi目录，然后创建usdtabi.js文件，创建data变量把复制的abi赋值给data，然后export出去就好了

在页面引入abi

然后通过abi和对应的合约地址，实例化之后就能对这个合约进行操作，我们调用他的owner方法来获取合约的创建者

查询owner拥有多少token

下面是完整代码

<template>
   <div>
       owner : {{owner}}
   </div>
</template>
<script>
    const Web3 = require('web3');
    //引入合约中的abi
    import ABI from "/src/assets/abi/usdtabi"
    function log(e){
        console.log(e)
    }
    var _self = null
    export default {
        name: 'Home',
        data(){
            return{
                web3:null,
                myContract:null,
                owner:null
            }
        },
        mounted() {
            _self = this
            this.init();
        },
        methods:{
            //初始化  连接私有链
            init(){
                //本地私有网络地址
                let host = "http://127.0.0.1:8545"
                //创建providers
                const httpprovi = new Web3.providers.HttpProvider(host)
                this.web3 = new Web3( httpprovi)
                //实例化之后连接合约
                this.connectContract()
            },
            //连接合约
            async connectContract(){
                //合约的abi
                let abi =ABI["data"];
                //合约地址
                let contractAddress = '0xe78A0F7E598Cc8b0Bb87894B0F60dD2a88d6a8Ab'
                this.myContract = new this.web3.eth.Contract(abi, contractAddress);
                //查询合约拥有者
                this.owner =await  this.myContract.methods.owner().call()
                log("owner: "+this.owner)
                //查询合约拥有者有多少token
                this.balance =await  this.myContract.methods.balanceOf(this.owner).call()
                log("balance: "+this.balance)
            } ,

        }
    }
</script>