1. vue-bulma-progress-bar
ProgressBar Component for Vue Bulma
vue-bulma-progress-bar
Package: vue-bulma-progress-bar
Created by: vue-bulma
Last modified: Tue, 28 Jun 2022 19:05:45 GMT
Version: 1.0.2
License: MIT
Downloads: 434
Repository: https://github.com/vue-bulma/progress-bar

Install

npm install vue-bulma-progress-bar
yarn add vue-bulma-progress-bar

ProgressBar

ProgressBar component for Vue Bulma.

Installation

$ npm install vue-bulma-progress-bar --save

Examples

<template>
  <progress-bar :type="'success'" :size="'large'" :value="dynamicValue" :max="100" :show-label="true"></progress-bar>
</template>

<script>
import ProgressBar from 'vue-bulma-progress-bar'

export default {
  components: {
    ProgressBar
  },

  data () {
    return {
      dynamicValue: 60
    }
  },

  methods: {
    plus () {
      if (this.dynamicValue === 100) return
      this.dynamicValue += 10
    },

    minus () {
      if (this.dynamicValue === 0) return
      this.dynamicValue -= 10
    }
  }

}
</script>

Badges



fundon.me  · 
GitHub @fundon  · 
Twitter @_fundon

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin