|
- /*
- Learun-MPUI
- 力软框架小程序 UI 库 (uni-app 专用)
-
- 在项目中使用本 UI 库,需要以下三个步骤:
- 1、将本项目文件夹放置在 /components/ 内;
-
- 2、在 /main.js 中添加以下内容,以导入 mixins 和 CSS:
- import '@/components/learun-mpui'
-
- 3、在 /pages.json 中添加以下内容,以引入组件:
- "easycom": {
- "custom": {
- // #ifdef MP-ALIPAY
- "l-(.+)": "@/components/learun-ui-ali/$1.vue",
- // #endif
-
- // #ifndef MP-ALIPAY
- "l-(.*)": "@/components/learun-ui-wx/$1.vue",
- // #endif
-
- "-": "-"
- }
- }
-
- */
-
- import Vue from 'vue'
-
- import uiIcons from './icons.js'
- import uiColors from './colors.js'
-
- // 现在 CSS 必须在 <style> 中引入,参考:https://ask.dcloud.net.cn/question/86907
- // 等待 uni-app 后续升级后可以解除下行代码的注释
- // import './styles/index.css'
-
- const mixins = {
- props: {
- // #ifdef MP-ALIPAY
- style: { default: '' },
- className: { default: '' },
- // #endif
- },
-
- methods: {
- getStyle(style) {
- const styleHelper = t => {
- if (!t) { return '' }
-
- return typeof t === 'object' ?
- Object.entries(t).map(([k, v]) => v ? `${k.replace(/([A-Z])/g,"-$1").toLowerCase()}: ${v}; ` : '') :
- '' + t
- }
-
- return styleHelper(this.style) + styleHelper(style)
- },
-
- getColor(colorStr, defaultValue = null) {
- if (colorStr.startsWith('#')) {
- return colorStr
- }
-
- const result = this.colors.find(t => t.color === colorStr)
- return result ? result.name : defaultValue
- },
-
- getUiIcons() {
- return uiIcons
- },
-
- getUiColors() {
- return uiColors
- }
- }
- }
-
- Vue.mixin(mixins)
|