https://github.com/ziqiangwang/v-popper

vue components base on popper.js
https://github.com/ziqiangwang/v-popper

component popperjs vue

Last synced: 7 days ago
JSON representation

vue components base on popper.js

• Host: GitHub
• URL: https://github.com/ziqiangwang/v-popper
• Owner: ZiQiangWang
• License: mit
• Created: 2018-05-17T08:28:39.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2018-06-11T15:54:46.000Z (over 6 years ago)
• Last Synced: 2024-10-31T17:54:09.108Z (2 months ago)
• Topics: component, popperjs, vue
• Language: Vue
• Size: 135 KB
• Stars: 1
• Watchers: 2
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# v-popper

[![NPM version][npm-badge]][npm-url]

[![NPM downloads][npm-downloads]][npm-url]

[npm-badge]: https://img.shields.io/npm/v/v-popper.svg

[npm-url]: https://www.npmjs.com/package/v-popper

[npm-downloads]: https://img.shields.io/npm/dm/v-popper.svg

vue components base on popper.js

## Install

```js

npm install v-popper --save

```

## Usage

```vue

  


    

       content

      click me

    

  


import Popper from 'v-popper';

export default {

  components: {

    Popper

  }

};

```

## Props

Props | Type | Default | Description 

:-- | :-: | :-- |- 

trigger | String | hover | Optional value: hover or click 

options | Object | { placement: 'bottom' } | Popper.js [options](https://popper.js.org/popper-documentation.html) 

transition | String |  | [Vue transition](https://vuejs.org/v2/guide/transitions.html) 

append-to-body | Boolean | false |  

boundary | String |  | Selector of boundary 

delay | Number | 10 | Delay of show and hide 

offset | String |  | [Offset of popper](https://popper.js.org/popper-documentation.html#modifiers..offset) 

disabled | Boolean | false |  

z-index | Number | 10 | z-index of popper 

## Attention

Props `transition` will not work correctly if transition class contains css such as:

```css

transform: scaleY(1);

```

or:

```css

transition: all 0.2s ease;

```

Because popper.js use transform in style.