@wemt/uniapp-vue3

一个基于 Vue 3 的 uni-app 开发框架，提供了一系列实用的工具和模块，帮助开发者快速构建 uni-app 应用。

✨ 功能特性

• 🚀 基于 Vue 3 + TypeScript 开发
• 📦 使用 Pinia 进行状态管理
• 🔒 内置加密工具
• 🌐 统一的网络请求处理
• 🔄 自动的存储同步机制
• 🎯 完整的类型支持
• 📱 支持多端开发

📦 安装

npm install @wemt/uniapp-vue3

🚀 快速开始

import { createSSRApp } from "vue";
import App from "./App.vue";

import wemt from "@wemt/uniapp-vue3";

export function createApp() {
  const app = createSSRApp(App);
  app.use(wemt, {
    version: "100",
    debug: true,
    crypto: {
      key: "wemt2014@#$%^&*()_+QWERTYUIOPASDFGHJKL",
      iv: "wemt2014@#$%^&*",
      algorithm: "AES",
    },
    hook: {},
    language: {},
    request: {
      baseURL: "https://api.example.com",
      header: {
        "Content-Type": "application/json",
      },
      encrypt: true,
    },
    storage: {
      prefix: "wemt_",
      encrypt: true,
    },
  });
  return {
    app,
  };
}

模板中使用

<template>
  <view>
    <!-- 登录状态显示 -->
    <view v-if="$store.user">
      <text>已登录用户: {{ $store.user.user__id }}</text>
    </view>

    <view class="mt-8 space-y-6">
      <button @click="login">登录</button>
      <button @click="logout">退出</button>
    </view>
  </view>
</template>

选项式

export default {
  data() {
    return {};
  },
  methods: {
    login() {
      this.$wemt.user
        .login(
          {
            username: "username",
            password: "password",
          },
          (response: any) => {
            console.log("Login successful:", response);
          }
        )
        .catch((error: any) => {
          console.error("Login failed:", error);
        });
    },
    logout() {
      this.$wemt.user.logout();
    },
  },
};

组合式

import { getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance()!;
const wemt = proxy?.$wemt;

const wemt = inject("wemt");

核心模块

• Storage: 本地存储管理 - 提供统一的本地存储接口，支持自动序列化和过期时间管理
• Router: 路由管理 - 封装 uni-app 路由，提供类型安全的路由跳转和参数传递
• Crypto: 加密工具 - 提供常用的加密解密功能，支持 MD5、AES 等算法
• Utils: 通用工具函数 - 提供常用的工具函数，如日期格式化、字符串处理等
• Hook: 事件钩子系统 - 提供全局事件订阅和发布机制，支持异步事件处理
• User: 用户信息管理 - 管理用户登录状态、Token 和权限信息
• Store: 状态管理 - 基于 Pinia 的状态管理，支持自动持久化
• Request: 网络请求 - 统一的网络请求处理，支持自动 loading 和错误处理

依赖要求

• Vue >= 3.4.21
• Pinia >= 3.0.2
• crypto.js >= 3.3.4

🤝 贡献

欢迎提交 Issue 和 Pull Request！

📄 许可证

MIT

👨‍💻 作者

Mutaoinc & Wemt Team

如果这个工具对你有帮助，请给个 ⭐ Star 支持一下！