更新记录

1.6.60（2025-05-30） 下载此版本

修复toast组件bug

1.6.56（2025-05-30） 下载此版本

修改bug

1.6.55（2025-05-27） 下载此版本

修改部分bug

平台兼容性

uni-app

其他

fd-ui

兼容

::: warning 不支持 vue2版本的微信小程序 :::

支持 vue2、vue3

• 微信小程序
• APP
• H5

开始

组件安装下载后

// pages.json 
"easycom": {
    "autoscan": true,
    "custom": {
        "^f-(.*)": "@/uni_modules/fd-ui/components/f-$1/f-$1.vue"
    }
},

// main.js
import fdUi from '@/uni_modules/fd-ui'
Vue.use(fdUi)

配置

// 上传配置
uni.$f.upload = {
    // 上传地址
    url: '',
    // 上传请求头
    header: {},
    // 上传文件名
    name: 'file',
    // 上传超时时间
    timeout: 60000
}

<!-- App.vue -->
<style lang="scss">

@import url('@/uni_modules/fd-ui/index.scss');

</style>

/* uni.scss */
@import '@/uni_modules/fd-ui/theme.scss';

自定义主题

/**
 * 在uni.scss 文件下
 */

@import '@/uni_modules/fd-ui/theme.scss';

/**
 * 在引入主题文件后通过修改颜色变量从而修改颜色
 */

$f-primary-color: 自定义主题色;
$f-success-color: 自定义主题色;
$f-danger-color: 自定义主题色;
$f-warning-color: 自定义主题色;
$f-black: 自定义主题色;
$f-bg-color: 自定义主题色;

$f-primary-color-80: rgba($f-primary-color, 0.8);
$f-primary-color-40: rgba($f-primary-color, 0.4);
$f-primary-color-15: rgba($f-primary-color, 0.15);
$f-primary-color-5: rgba($f-primary-color, 0.05);

$f-success-color-80: rgba($f-success-color, 0.8);
$f-success-color-40: rgba($f-success-color, 0.4);
$f-success-color-15: rgba($f-success-color, 0.15);

$f-danger-color-80: rgba($f-danger-color, 0.8);
$f-danger-color-40: rgba($f-danger-color, 0.4);
$f-danger-color-15: rgba($f-danger-color, 0.15);

$f-warning-color-80: rgba($f-warning-color, 0.8);
$f-warning-color-40: rgba($f-warning-color, 0.4);
$f-warning-color-15: rgba($f-warning-color, 0.15);

$f-black-85: rgba($f-black, 0.85);
$f-black-80: rgba($f-black, 0.8);
$f-black-65: rgba($f-black, 0.65);
$f-black-45: rgba($f-black, 0.45);
$f-black-35: rgba($f-black, 0.35);
$f-black-25: rgba($f-black, 0.25);
$f-black-15: rgba($f-black, 0.15);
$f-black-10: rgba($f-black, 0.1);
$f-black-5: rgba($f-black, 0.05);