更新记录
1.3.9(2026-09-08) 下载此版本
- 修复 fu-vtabs 组件在频繁快速滚动到顶部时无法准确定位的问题
- 优化部分已知问题
1.3.8(2026-09-08) 下载此版本
- 新增 getData 函数 自动根据字符串路径获取对象中的值支持.和[] , 且任意一个值为undefined时,不会报错,会直接返回undefined 调用方式:uni.$fu.getData(dataObj, name)
- 新增 fu-textarea 组件 ignoreCompositionEvent 属性,默认 true
- 新增 fu-input 组件 ignoreCompositionEvent 属性,默认 true
1.3.7(2026-08-24) 下载此版本
- 兼容鸿蒙系统
- 优化fu-swipe-action和fu-swipe-action-item组件
平台兼容性
uni-app(4.01)
| Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
|---|---|---|---|---|---|---|---|---|
| × | √ | √ | √ | √ | √ | √ | √ | √ |
| 微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 小红书小程序 | 快应用-华为 | 快应用-联盟 |
|---|---|---|---|---|---|---|---|---|---|---|---|
| √ | √ | - | - | - | - | - | √ | - | - | - | - |
其他
| 多语言 | 暗黑模式 | 宽屏模式 | 蒸汽模式 |
|---|---|---|---|
| × | × | √ | × |
✨ Fusions UI
fusions-ui
Vue3 + TypeScript 的跨平台多端的 UI 框架
📖 项目简介
Fusions UI 是一个基于 Vue3 + TypeScript 的跨平台多端的 UI 框架,提供开箱即用的高质量组件,助力开发者快速构建跨端应用。 本项目是其完整的组件使用示例与交互演示
✨ 核心特性
| 特性 | 说明 |
|---|---|
| 🚀 Vue3 + TypeScript | 采用最新 Vue3 Composition API,完整的 TypeScript 类型支持 |
| 📱 多端兼容 | 一套代码,同时支持 H5、微信小程序、支付宝小程序、App 等平台 |
| 🎨 丰富组件 | 涵盖基础、表单、数据展示、反馈、导航、布局等 6 大类 60+ 个组件 |
| 🔧 API工具链 | 内置丰富的工具函数(校验、转换、格式化等),挂载于 uni.$fu 上,开箱即用 |
| 📦 按需引入 | 支持 easycom 自动注册,无需手动导入 |
🚀 快速开始
📋 环境要求
- Node.js >= 16
- pnpm >= 7 / yarn / npm
📦 安装组件库
在你的 UniApp 项目中安装:
# 使用 pnpm (推荐)
pnpm add fusions-ui
# 使用 yarn
yarn add fusions-ui
# 使用 npm
npm install fusions-ui
⚙️ 配置组件库
1. 在 main.ts 中引入组件库:
import App from './App.vue'
import { createApp } from 'vue'
import FusionsUI from 'fusions-ui'
export function createApp() {
const app = createSSRApp(App)
app.use(FusionsUI)
return {
app
}
}
2. 在 App.vue 中引入样式:
<style lang="scss">
@import 'fusions-ui/index.scss';
</style>
4. TypeScript 类型支持
{
"compilerOptions": {
"sourceMap": true,
"baseUrl": ".",
"paths": {
"@/*": ["./*"]
},
"lib": ["esnext", "dom"],
"types": ["@dcloudio/types"]
},
"include": [
"**/*.ts",
"**/*.d.ts",
"**/*.vue"
]
}
5. 配置组件自动注册
在你的项目 pages.json 文件中添加 easycom 配置:
{
"easycom": {
"autoscan": true,
"custom": {
"^fu-(.*)": "fusions-ui/components/$1/src/$1.vue"
}
}
}
🎯 使用组件
在页面中直接使用组件:
<template>
<view>
<fu-button>主要按钮</fu-button>
</view>
</template>
🔗 相关链接
📄 开源协议
遵循 MIT 开源协议,意味着您无需支付任何费用,也无需授权。
⭐ 如果这个项目对您有帮助,请给我们一个 Star!
Made with ❤️ by Fusions Team

收藏人数:
https://gitee.com/fumicro/fusions-ui
https://www.npmjs.com/package/fusions-ui
下载插件并导入HBuilderX
下载示例项目ZIP
赞赏(0)
下载 1244
赞赏 12
下载 12676054
赞赏 1956
赞赏
京公网安备:11010802035340号