v-selectpage简洁而强大的下拉分页选择器

v-selectpage

简洁而强大的下拉分页选择器

基于 Vue2 强大的选择器, 可分页的列表或表格展现形式, 使用标签形式的多选模式, 国际化 i18n 和服务端数据源支持

文档、实例

请浏览

• English site

• 国内站点

jQuery 版本: SelectPage

功能特点

• 分页展示数据

• i18n 支持, 提供了 中文、英文、日文 等语言

• 服务端数据源支持

• 使用标签模式进行项目多选

• 可使用键盘进行快速导航

• 提供快速搜索，进行快速数据定位

• 提供列表视图和表格视图进行展示数据

• 可自定义行显示方式

插件预览

列表视图单选模式

列表视图使用标签的多选模式

表格视图

插件安装

npm install v-selectpage --save

在项目入口 main.js 中引入

import Vue from 'vue'
import vSelectPage from 'v-selectpage';
Vue.use(vSelectPage);

在页面中使用

template

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

script

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