Skip to content
Vue component which uses Scoped Slots (https://vuejs.org/v2/guide/components-slots.html#Scoped-Slots) for checking Metamask (https://metamask.io/) inpage provider object
JavaScript Vue
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
__tests__
src
.babelrc
.gitignore
.travis.yml
LICENSE
README.md
package-lock.json
package.json
rollup.config.js
yarn.lock

README.md

Metamask Checker — Vue

License Build Status Coverage Status

Live demo

Description

Vue component which uses Scoped Slots for checking Metamask inpage provider object.

Note: only new version of Metamask API is supported. Related links:

Installation

yarn add @metamask-checker/vue

# or

npm install --save @metamask-checker/vue

Testing

yarn test:jest # Runs Jest with coverage collection
yarn test:coverage # Sends coverage to .coveralls.io
yarn test # yarn test:jest && yarn test:coverage

# or

npm run test:jest
npm run test:coverage
npm test

Usage

<!-- ./src/App.vue -->

<template>
  <MetamaskChecker
    <!-- -->
    <!--:account="null"-->
    <!--:network="null"-->
    <!--:onCheckError="(error) => null"-->
    <!--:onCheckSuccess="(provider, account, network) => null"-->
  >
    <div id="err" slot="errored" slot-scope="{ error }">
      {{ error.message || 'Unexpected error' }}
    </div>

    <div id="app" slot="checked" slot-scope="{ provider, selectedAccount, selectedNetwork }">
      Selected account {{ selectedAccount }} in selected network {{ selectedNetwork }}
    </div>

    <div id="loader">
      Loader...
    </div>
  </MetamaskChecker>
</template>

<script>
  import MetamaskChecker from '@metamask-checker/vue'

  export default {
    components: {
      MetamaskChecker,
    },
  }
</script>
You can’t perform that action at this time.