二次开发

关于 UXUI 二次开发

框架的组件样式都源于作者的积累和开发习惯,在使用框架中,肯定会有很多地方无法满足您的实际需要。下面为您介绍一下我们推荐的二次开发方式。

1. 样式二次开发 ( 使用自定义样式扩展 )

新建一个自己的样式文件,如 : /myStyle.scss 或 在 uni.scss 中进行自定义样式扩展。

1.1 在自己的样式中添加框架内没有的样式,如 :

.my-title{font-size:38rpx; color:red;}

1.2 复写框架已有样式,达到修改的目的,如 :

.ux-h1{font-size:100rpx;}

1.3 在 app.vue 中加载自己的样式 ( 如果在 uni.scss 中进行扩展,可以免去此步 ):

<style lang="scss">
/* 加载框架样式 */
@import "@/uni_modules/unix-ui/uxui.scss";
/* 加载自定义样式 */
@import "@/myStyle.scss";
</style>

2. 组件二次开发

不要直接修改 uxui 的组件源码,这样会导致您无法顺利更新框架。

推荐您 使用复制组件的方式来修改组件,实现步骤 :

2.1. 复制要改进的 uxui 组件如 :

项目根目录/uni_modules/unix-ui/components/ux-status-bar/ux-status-bar.uvue
复制到 ( 注意下面的目录结构满足 uni-app 默认的组件自动加载规范 )
项目根目录/components/my-status-bar/my-status-bar.uvue

2.2. 修改组件源码

根据您的实际需求,改进已复制的组件。

2.3. 调用自己修改后的组件

<my-status-bar></my-status-bar>

经过上面的操作,您既可以实现框架的修改( 二次开发 )又可以顺利地更新 uxui 框架。