vue+iview分页组件的封装
vue+iview的分页组件封装
1.在components中创建pagination文件夹,接着创建src,index.js,index.less文件
2.index.less文件
//需要修改的样式
.ivu-page-options{
margin-left:10px;
.ivu-page-options-sizer{
margin-right:0;
}
}
3.index.js文件
import"./index.less";
importcomponentfrom"./src/main";
/*istanbulignorenext*/
component.install=function(Vue){
Vue.component(component.name,component);
};
exportdefaultcomponent;
4.src文件夹中的main.vue
5.在components中创建index.js,用于全局引入
importGlobalPagefrom"@/components/pagination/index.js";
exportdefault(Vue)=>{
Vue.component("GlobalPage",GlobalPage);
}
6然后在全局的main.js引入,可全局使用
importcomponentsfrom"@/components/index.js"; Vue.use(components)
7.组件的使用
关于vue.js组件的教程,请大家点击专题vue.js组件学习教程进行学习。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。