Files
admin_core/demo/快速修复指南.md
张成 ba61c9e45d 1
2025-10-09 18:17:41 +08:00

2.8 KiB
Raw Blame History

🚀 快速修复指南

常见错误用法

1. 错误的 HTTP 导入

// ❌ 错误!不要这样写
import http from '@/utils/admin-framework.js'
import { http } from 'admin-framework'

// ✅ 正确!直接使用
this.$http.get('/api/xxx')
window.framework.http.get('/api/xxx')

2. 错误的工具函数导入

// ❌ 错误!不要这样写
import tools from 'admin-framework/tools'

// ✅ 正确!直接使用
this.$tools.formatDate(new Date())
window.framework.tools.formatDate(new Date())

正确的使用方式

在 Vue 组件中

<script>
export default {
  data() {
    return {
      // ✅ 从配置中获取
      uploadUrl: this.$config.uploadUrl
    }
  },
  
  methods: {
    async loadData() {
      // ✅ 使用 this.$http
      const res = await this.$http.get('/api/users')
      
      // ✅ 使用 this.$tools
      const date = this.$tools.formatDate(new Date(), 'yyyy-MM-dd')
      
      // ✅ 使用 this.$uiTool
      this.$uiTool.success('操作成功')
      
      // ✅ 路由跳转使用 path
      this.$router.push({ path: '/home' })
    }
  }
}
</script>

在 API 模块中

// src/api/ball/gamesServer.js

class GamesServer {
  async getList(params) {
    // ✅ 使用 window.framework.http
    return await window.framework.http.post('/games/page', params)
  }
}

export default new GamesServer()

在组件中使用 API

<script>
import gamesServer from '@/api/ball/gamesServer.js'

export default {
  methods: {
    async loadData() {
      const res = await gamesServer.getList({ page: 1, size: 20 })
    }
  }
}
</script>

📝 修改步骤

步骤1修改所有 API 文件

查找并替换:

// 查找
import http from '@/utils/admin-framework.js'
http.http.get(...)

// 替换为
window.framework.http.get(...)

步骤2修改路由跳转

查找并替换:

// 查找
this.$router.push({ name: 'xxx' })

// 替换为
this.$router.push({ path: '/xxx/yyy' })

步骤3重新构建框架

# 在项目根目录
npm run build

步骤4测试

# 在 demo 目录
cd demo
npm run dev

🔍 检查清单

  • 所有 API 文件都使用 window.framework.http
  • 所有路由跳转都使用 path 而不是 name
  • 组件中使用 this.$httpthis.$toolsthis.$uiTool
  • 组件映射表已配置(demo/src/router/component-map.js
  • 框架已重新构建(npm run build
  • Demo 可以正常运行(cd demo && npm run dev

📚 更多说明

详细使用说明请查看:

  • demo/使用说明.md - 完整的使用指南
  • demo/src/api/ball/gamesServer.js - API 模块示例
  • _doc/完整使用文档.md - 框架完整文档