vue-metamask
v2.2.1
Published
Testing Metamask status with Vue
Downloads
145
Maintainers
Readme
vue-metamask
Demo
MetaMask will introduce an optional “Privacy Mode”, which requires that dapps ask permission to view users’ accounts. Dapps should update their code to support this feature, which will be enabled by default in the future. Reference link
NPM Install
npm i vue-metamask -S
And then import it:
<script>
import VueMetamask from 'vue-metamask';
export default {
components: {
VueMetamask,
},
data(){
return {
msg: "This is demo net work"
}
},
methods:{
onComplete(data){
console.log('data:', data);
}
}
}
</script>
Use
<template>
<div id="demo">
<vue-metamask
userMessage="msg"
@onComplete="onComplete"
>
</vue-metamask>
</div>
</template>
How to use init connect option
<template>
<div id="demo">
// close init connect
<vue-metamask ref="metamask" :initConnect="false"></vue-metamask>
// click button call Init
<button @click="connect">connect</button>
</div>
</template>
Get ref target use init methods
<script>
import VueMetamask from 'vue-metamask';
export default {
components: {
VueMetamask,
},
methods:{
connect() {
this.$refs.metamask.init();
}
}
}
</script>
Methods
|data | type | value | Functionality | |-----------|-----------|-----------|---------------| |initConnect | Boolean |true (default)| Whether to connect initially | |userMessage ( Optional ) | String |Message| return setting status message| |onComplete | Event | Callback | return current data|
OnComplete return data
| key | type | value | Description | |-----------|-----------|-----------|---------------| | web3 | Object | function | web3 | | metaMaskAddress | String | 0x09F38A7F... | Metamask address | | message | String | "message" | User-defined message | | type | String | "MAINNET" | MAINNETNO_INSTALL_METAMASKNO_LOGINNETWORK_ERRORUSER_DENIED_ACCOUNT_AUTHORIZATION | | netID | String | "1" | User's current network id |
License
MIT.