2.1.4 • Published 2 years ago

v-selectpage2 v2.1.4

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

v-selectpage · circle ci code coverage npm version

A powerful selection plugin for Vue2, list or table view of pagination, use tags form for multiple selection, i18n and server side resources supports

Financial Contributors on Open Collective JavaScript Style Guide npm download license

Examples and Documentation

Live Examples on CodePen, more examples and documentation please visit below sites

The jQuery version: SelectPage

Features

  • show content by pagination
  • i18n support, provided languages:
    • Chinese
    • English
    • Japanese
    • Arabic
    • Spanish
    • German
    • Romanian
    • French
    • Portuguese-Brazil
    • Polish
    • Dutch
  • server side data source support
  • tag form for multiple selection
  • keyboard to quick navigate
  • quick search for autocomplete
  • list view and table view to show content
  • custom row content render

Browsers support

IE / EdgeFirefoxChromeSafariOpera
IE9, IE10, IE11, EdgeFirefox 18+Chrome 49+Safari 10+Opera 36+

Installation

npm i v-selectpage --save

Include and install plugin in your main.js file.

import Vue from 'vue'
import SelectPage from 'v-selectpage'
Vue.use(SelectPage, { global config options })

You also can import v-selectpage as a local component

import { SelectPage } from 'v-selectpage'

export default {
  components: {
    'v-selectpage': SelectPage
  }
}

Usage

<template>
  <v-selectpage :data="list" key-field="id" show-field="name" >
  </v-selectpage>
</template>

<script>
export default {
  data () {
    return {
      list: [
        { id:1 ,name: 'Chicago Bulls',desc:'芝加哥公牛' },
        { id:2 ,name: 'Cleveland Cavaliers',desc:'克里夫兰骑士' },
        { ... }
      ]
    }
  }
}
</script>

Plugin preview

List view for Single selection

single

List view for multiple selection with tags form

multiple

Table view for single selection

table

Contributors

Code Contributors

This project exists thanks to all the people who contribute. [Contribute].

Financial Contributors

Become a financial contributor and help us sustain our community. [Contribute]

Individuals

Organizations

Support this project with your organization. Your logo will show up here with a link to your website. [Contribute]

Dependenics

Vue plugin series

PluginStatusDescription
v-pagenpm versionA simple pagination bar, including length Menu, i18n support
v-dialogsnpm versionA simple and powerful dialog, including Modal, Alert, Mask and Toast modes
v-tablegridnpm versionA simpler to use and practical datatable
v-uploadernpm versionA Vue2 plugin to make files upload simple and easier, you can drag files or select file in dialog to upload
v-ztreenpm versionA simple tree for Vue2, support single or multiple(check) select tree, and support server side data
v-gallerynpm versionA Vue2 plugin make browsing images in gallery
v-regionnpm versionA simple region selector, provide Chinese administrative division data
v-selectpagenpm versionA powerful selector for Vue2, list or table view of pagination, use tags for multiple selection, i18n and server side resources supports
v-suggestnpm versionA Vue2 plugin for input suggestions by autocomplete
v-playbacknpm versionA Vue2 plugin to make video play easier
v-selectmenunpm versionA simple, easier and highly customized menu solution