Web3是一组广泛的运动和协议，旨在使互联网更加去中心化、可验证和安全；Web3愿景是一个无服务器和去中心化的互联网，即一个用户控制自己的身份、数据和命运的互联网；Web3将启动全新的全球数字经济体系，创造新的商业模式和新的市场，打破平台垄断，促进广泛的Andabove创新。从Web2.0到Web3.0知识储备web3.jsDApp的Solidity合约IPFS+DAPP真正的WEB3.0时代来临例子：vue-web3modal-example前言工作中，每天重复昨天的工作（复制粘贴），由于从事区块链的工作，所以写DAPP是必不可少的。Web端DAPP实现，使用web3js与以太坊网络上的节点合约进行交互。DAPP主要发布在Imtoken、Metamask等钱包上，当然也有PC端的。业界比较有名的是ETH上的Dapp：uniswap。思考：它怎么能连接那么多钱包呢？然后连夜翻了它的源码，可惜是react写的（本想抄别人的代码，结果自己用的想法破灭了！“狗头”），而我的dapp是vuejs写的。很难推翻它，用React重写它。不行的话就copy一下。。。既然经常用到这种代码，写一个vue-cli-plugin-web3modal，这样就可以插拔了。不自定义cli怎么样？使用vueaddvue-cli-plugin-web3modal或npminstall--save-devvue-cli-plugin-web3modalyarnaddvue-cli-plugin-web3modal--dev根据提示一步步配置即可自己的情况，并等待下载依赖包（可能需要很长时间，因为需要下载钱包节点提供商SDK）目录结构src│├──App.vue│├──assets││└──logo.png│├──组件││├──ConnectWallteExample.vue││└──HelloWorld.vue│├──hooks││└──useWallte.js//核心逻辑│├──main.js│├──registerServiceWorker.js│└──web3│├──abis.js//提供abis│├──chains.js│├──config.js//配置项│├──constants.dev.js│├──常量。js│└──tools.jssrc/web3/config.js，默认使用Metamask的web3provider，providerOptions配置可以参考https://github.com/Web3Modal/...，Metamask使用Infura的server作为web3provider默认。就像我们上面做的一样。然而，它也让用户可以选择自己的Web3提供商。因此，使用Metamask的web3提供程序，您可以让用户选择，而不必自己担心。//UsingMetamaskweb3providersconstproviderOptions={//注入供应商的例子yourBrowser"},package:null},//WalletConnect提供商walletconnect:{display:{logo:"data:image/gif;base64,INSERT_BASE64_STRING",name:"Mobile",description:"Scanqrcodewithyourmobilewallet"},package:WalletConnectProvider,options:{infuraId:"INFURA_ID"//required}}};src/hooks/useWallte.js等，可以参考ConnectWalteExample.vue这个demo。这就是vue-cli-plugin的好处。你可以随意增删改useWallter.js。一旦你有了合约的地址和ABI，你就可以像这样实例化Web3.js，你可以愉快地调用我们的合约函数：callandsend注意??我们平时很少把myContract的实例化写在业务层.都是使用vue3的组合API，更好的解耦。如：@/components/ConnectWallteExample.vue//@/components/ConnectWallteExample.vue@/hooks/useGswap.js//@/hooks/useGswap.jsimport{ref,computed,toRefs,watch,watchEffect,}from'vue';import{GSWAPABI,POINTABI}from'@/web3/abi';import{gswapAddress,poinAddress}from'@/web3/config';exportdefaultfunction(props){const{web3,userAddress,connected}=toRefs(props);constcontract=computed(()=>newweb3.value.eth.Contract(GSWAPABI,gswapAddress),);constpointContract=computed(()=>newweb3.value.eth.Contract(POINTABI,poinAddress));//方法函数balanceOf(){returnpointContract.value.methods.balanceOf(userAddress.value).call().then((res)=>;资源）；}//....return{balanceOf};}ps：每天打鱼的时候，看到大佬们理财，一个个都有财富自由，慢慢萌生了理财的想法。基金和股票，本金涨少了也赚不到钱，亏钱真是割肉啊！一直在寻找赚钱快的金融解决方案，因为从事区块链相关工作，玩数字货币，“眼看着涨，……！”我没有趁机拥有财富和自由。……，不说了，老妈叫我吃韭菜饺子（离契约远点，真爱生活）
