1. vue-bulma-expanding
The expanding transition component for Vue Bulma
vue-bulma-expanding
Package: vue-bulma-expanding
Created by: vue-bulma
Last modified: Tue, 28 Jun 2022 19:05:31 GMT
Version: 0.0.1
License: MIT
Downloads: 1,262
Repository: https://github.com/vue-bulma/expanding

Install

npm install vue-bulma-expanding
yarn add vue-bulma-expanding

Expanding

The Expanding Transition Component for Vue 2.0

Installation

$ npm install vue-bulma-expanding --save

Examples

<template>
  <router-link to="/charts" aria-expanded="show" @click.native="show = !show">
    <span class="icon is-small"><i class="fa fa-bar-chart-o"></i></span>
    Charts
    <span class="icon is-small is-angle"><i class="fa fa-angle-down"></i></span>
  </router-link>
  <expanding>
    <ul v-show="show">
      <li>
        <router-link to="/charts/chartjs">
          ChartJs
        </router-link>
      </li>
      <li>
        <router-link to="/charts/chartist">
          Chartist
        </router-link>
      </li>
      <li>
        <router-link to="/charts/peity">
          Peity
        </router-link>
      </li>
      <li>
        <router-link to="/charts/plotly">
          Plotly
        </router-link>
      </li>
    </ul>
  </expanding>
</template>

<script>
import Expanding from '../Expanding'

export default {
  components: {
    Expanding
  },

  data () {
    return {
      show: false
    }
  }
}
</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