以太坊智能合约开发指南7（编写Dapp）

这一篇中我们来完成Dapp的界面编写。

页面布局

    
    
    

    

    




    

        

            

                

                    

                        

                            
ERC20代币合约
                        
                        

                            

                                名称(name)：
                                
                            
                            

                                标识符(symbol)：
                                
                            
                            

                                总额(totalSupply)：
                                
                            
                            

                                当前帐户(account)：
                                
                            
                            

                                余额(balanceOf)：
                                
                            
                            

                                从当前账户转移(transfer)：
                                

                                    地址
                                    
                                
                                

                                    金额
                                    
                                
                            
                            提交
                        
                    
                
            
        
    

为了让界面美观些，引入了bootstrap框架。限于篇幅，这里并不演示transferFrom approve allowance 等方法调用。原理是一样的。

脚本调用

接下来是脚本部分，简单起见，都放在一个文件中。

这里http://localhost:8545 是本地geth节点的rpc端口。

var accountInterval = setInterval(function() {
            if (web3.eth.accounts[0] !== account) {
                account = web3.eth.accounts[0];
                web3.eth.defaultAccount = web3.eth.accounts[0];                
                updateInterface();
            }
            }, 100);

这段代码是定时查询当前账户是否有变动，如果变动就刷新页面。

abi的值，可以在remix编译完合约后，点Details按钮找到。

address 的值是部署完合约后的实际地址，需要根据实际填写。