Web3.js获取MetaMask钱包地址 新建一个文件夹Wb3.js
function Init(callback) {
//判断用户是否安装MetaMask钱包插件
if (typeof window.ethereum === "undefined") {
//没安装MetaMask钱包进行弹框提示
Message.warning("请安装MetaMask")
} else {
//如果用户安装了MetaMask，你可以要求他们授权应用登录并获取其账号
ethereum.enable()
.catch(function(reason) {
//如果用户拒绝了登录请求
if (reason === "User rejected provider access") {
// 用户拒绝登录后执行语句；
} else {
// 本不该执行到这里，但是真到这里了，说明发生了意外
Message.warning("There was a problem signing you in");
}
}).then(function(accounts) {
// 判断是否连接以太
if (ethereum.networkVersion !== desiredNetwork) {}
let currentProvider = web3.currentProvider;
web3.setProvider(currentProvider);
//如果用户同意了登录请求，你就可以拿到用户的账号
web3.eth.defaultAccount = accounts[0];
myContract = new web3.eth.Contract(ABI, metaMaskAddress);
//这里返回用户钱包地址
callback(accounts[0]);
});
}
}
在vue中引入
【Web3|Web3js获取MetaMask钱包并监听切换】官方API方法监听账号切换
mounted() {
this.fn();
}
methods:{
fn() {
ethereum.on("accountsChanged", function(accounts) {
console.log(accounts[0]);
//一旦切换账号这里就会执行
});
},
},
推荐阅读
- js方法|Vuex入门(六)——mapState, mapGetters, mapMutations, mapActions全网最全详解终结篇(带源码)
- vue|Vue项目使用开发工具vuejs-devtools最新简单安装方法
- js方法|Vuex入门(五)—— 封装module全网最全详解(带源码)
- vue学习|Vue基础实现bilibili移动端页面
- vue|VUE哔哩哔哩移动端项目使用vant 实现发布功能（上传文件）
- css|40个适合初学者练习HTML和CSS的案例
- 视频教程|Web 前端视频资源分享（Bootstrap/Vue/小程序）
- java|Java五年，已财富自由，美人在手！
- VUE|VUE this.$nextTick()的使用场景