Vue2的强大标签选择器,支持多重选择,列表或表视图,i18n和服务器端渲染。
# NPM
$ npm install v-selectpage --save
在项目入口main.js
中引入插件
// 使用v-selectpage作为插件
import Vue from 'vue'
import vSelectPage from 'v-selectpage'
Vue.use(vSelectPage, {
// server side data loader
dataLoad: function(vue, data, params){
return new Promise((resolve, reject)=>{
axios.post(url, params).then(resp => resolve(resp), resp => reject(resp))
})
}
})
// 使用v-selectpage作为组件
import Vue from 'vue'
import { SelectPage } from 'v-selectpage'
// 组件
export default {
components: {
'v-selectpage': SelectPage
}
}
可在插件注册时进行全局配置的参数
<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>