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

2018/07/27 18:31
阅读数 1W

v-selectpage

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

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

文档、实例

请浏览

jQuery 版本: SelectPage    Demo:https://terryz.gitee.io/selectpage/demo.html

功能特点

  • 分页展示数据

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

  • 服务端数据源支持

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

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

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

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

  • 可自定义行显示方式

插件预览

列表视图单选模式

single

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

multiple

表格视图

table

插件安装

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:'克里夫兰骑士'},
                {...}
            ]
        }
    }
};
展开阅读全文
加载中

作者的其它热门文章

打赏
0
0 收藏
分享
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部