From a165f3223e9362e5cececdc963dab30e8ca8e657 Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Fri, 07 Mar 2025 13:01:10 +0800
Subject: [PATCH] 知识库文档，改写控制层基类主要方法列表
---
@framework/202-数据控制层基类Pilot.md | 140 +++++++++++++++++++++-------------
@framework/201-请求层基类Fetcher.md | 43 ----------
2 files changed, 86 insertions(+), 97 deletions(-)
diff --git "a/@framework/201-\350\257\267\346\261\202\345\261\202\345\237\272\347\261\273Fetcher.md" "b/@framework/201-\350\257\267\346\261\202\345\261\202\345\237\272\347\261\273Fetcher.md"
index 8415c1d..b99995a 100644
--- "a/@framework/201-\350\257\267\346\261\202\345\261\202\345\237\272\347\261\273Fetcher.md"
+++ "b/@framework/201-\350\257\267\346\261\202\345\261\202\345\237\272\347\261\273Fetcher.md"
@@ -12,7 +12,6 @@
- [`stringToCamel(str)`](#stringtocamelstr)
- [`stringToUnderline(str)`](#stringtounderlinestr)
- [`transKeyName(type, json)`](#transkeynametype-json)
- - [`transImgPath(type, path)`](#transimgpathtype-path)
- [请求的 options 配置](#请求的-options-配置)
- [`hostType` 主机类型](#hosttype-主机类型)
- [`silence` 静音请求](#silence-静音请求)
@@ -160,14 +159,6 @@
---
-
-
-
-
-
-
-
-
### `stringToCamel(str)`
**功能**
@@ -229,40 +220,6 @@
**注意事项**
- 支持嵌套对象的递归转换
-
----
-
-### `transImgPath(type, path)`
-**功能**
-转换图片路径，支持修复补齐或裁剪多余部分
-适用于处理旧版运营平台的图片路径，确保路径格式统一
-
-**参数**
-| 参数名 | 类型 | 说明 |
-| ------ | ------ | ---------------------------- |
-| type | String | 转换类型：`'fix'` 或 `'cut'` |
-| path | String | 需要转换的图片路径 |
-
-**返回值**
-| 类型 | 说明 |
-| ------ | ---------------- |
-| String | 转换后的图片路径 |
-
-**示例**
-```js
-
-class FCommon extends Fetcher {
-
- saveUserInfo() {
- const path = '4/5e56307c489c7.jpg';
- const result = this.transImgPath('fix', path); // 返回 '/upload/4/5e56307c489c7.jpg'
- }
-}
-```
-
-**注意事项**
-- 支持多路径（逗号分隔）的批量转换，即先分别处理每一项后再（逗号）合并
-
## 请求的 options 配置
diff --git "a/@framework/202-\346\225\260\346\215\256\346\216\247\345\210\266\345\261\202\345\237\272\347\261\273Pilot.md" "b/@framework/202-\346\225\260\346\215\256\346\216\247\345\210\266\345\261\202\345\237\272\347\261\273Pilot.md"
index ca5191e..9547ade 100644
--- "a/@framework/202-\346\225\260\346\215\256\346\216\247\345\210\266\345\261\202\345\237\272\347\261\273Pilot.md"
+++ "b/@framework/202-\346\225\260\346\215\256\346\216\247\345\210\266\345\261\202\345\237\272\347\261\273Pilot.md"
@@ -4,12 +4,15 @@
- [功能说明](#功能说明)
- [引用方法](#引用方法)
- [主要方法](#主要方法)
- - [创建页面合并对象](#创建页面合并对象)
- - [主要工作：生成合并对象](#主要工作生成合并对象)
- - [实际合并](#实际合并)
- - [页面能力扩展：跨页面通讯](#页面能力扩展跨页面通讯)
- - [页面能扩展：跨端通讯](#页面能扩展跨端通讯)
- - [转换静态图片引用](#转换静态图片引用)
+ - [`createOptions(dataAdd)`](#createoptionsdataadd)
+ - [`transAssets(assets)`](#transassetsassets)
+ - [静态图片地址转换说明](#静态图片地址转换说明)
+ - [页面合并流程](#页面合并流程)
+ - [第一步：生成合并对象](#第一步生成合并对象)
+ - [第二步：实际合并](#第二步实际合并)
+ - [页面能力扩展](#页面能力扩展)
+ - [跨页面通讯](#跨页面通讯)
+ - [跨端通讯](#跨端通讯)
## 功能说明
@@ -29,28 +32,84 @@
## 主要方法
-```js
-/**
- * 创建页面选项
- * @param {Object} [dataAdd] - 需要添加到 vue data 中的额外数据
- * @returns {Object} 页面选项对象
- */
-createOptions(dataAdd = {}) {}
-/**
- * 转换静态图片引用
- * @static
- * @param {Object} assets - 静态图片对象
- * @returns {Object} 转换后的静态图片对象
- */
-static transAssets(assets = {}) {}
+### `createOptions(dataAdd)`
+**功能**
+创建页面合并对象，将实例的属性和方法映射到页面合并对象中
+
+**参数**
+| 参数名 | 类型 | 说明 |
+| ------- | ------ | -------------------------- |
+| dataAdd | Object | 需要添加到页面中的额外数据 |
+
+**返回值**
+| 类型 | 说明 |
+| ------ | ------------ |
+| Object | 页面合并对象 |
+
+
+**注意事项**
+- 如果 `dataAdd` 中包含 `assets` 属性，会自动调用 transAssets 转换其中的图片地址值
+- `$` 开头的属性会被直接映射到合并对象中，同时去掉 `$` 前缀
+- 非 `$` 开头的属性会被映射到合并对象的 `methods` 属性中
+
+
+### `transAssets(assets)`
+**功能**
+转换静态图片引用的路径，根据运行环境（H5 或小程序）生成图片实际发布的路径
+
+**参数**
+| 参数名 | 类型 | 说明 |
+| ------ | ------ | ------------------ |
+| assets | Object | 包含图片路径的对象 |
+
+**返回值**
+| 类型 | 说明 |
+| ------ | -------------------- |
+| Object | 转换后的图片路径对象 |
+
+#### 静态图片地址转换说明
+
+在目前项目体系设计下，由于不同项目（公众号、小程序、混合app）图片加载机制的不同，设置了一个统一的图片地址转换入口
+经过静态方法 transAssets 转换，可以获得图片实际发布的地址
+
+**示例1**
+
+```javascript
+const assets = { logo: 'assets/images/logo.png' };
+const result = Pilot.transAssets(assets); // 输出转换后的图片实际发布地址
```
-## 创建页面合并对象
+**示例2**
+
+```HTML
+<template>
+ <image :src="assets.homeNav1" mode="aspectFit" />
+</template>
+```
+
+```js
+export default {
+ name: 'index',
+ ...new PIndex().createOptions({
+ // 首页菜单图片，会全部经过 transAssets 进行路径转换，转换为图片实际发布的地址
+ assets: {
+ homeNav1: 'assets/img/home-nav-01.png',
+ homeNav2: 'assets/img/home-nav-02.png',
+ homeNav3: 'assets/img/home-nav-03.png',
+ },
+ }),
+};
+```
+
+**注意事项**
+移动端的图片不要使用 css 背景，而是使用 image 图片元素，再填充由 transAssets 生成的实际发布地址
+
+## 页面合并流程
`createOptions` 是类 Pilot 的核心方法，此方法将独立申明的信息合并回原 Vue 对象
-### 主要工作：生成合并对象
+### 第一步：生成合并对象
* 扫描当前类，以 \$ 开头的属性或方法，去掉 \$ 符后，直接作为 Vue 的属性或方法准备合并
* 扫描当前类，非以 \$ 开头的方法，作为 Vue 对象申明中 methods 的子级方法准备合并
@@ -100,7 +159,7 @@
注意：不能在数据控制器中定义 $name、$components、$methods 这三项，因为实际合并时会覆盖
-### 实际合并
+### 第二步：实际合并
数据控制层和界面层实际的合并，其实是写在界面层上
由界面层实例化数据控制层，并使用其基类的 createOptions 方法生成选项，再合并进原 Vue 对象
@@ -118,8 +177,9 @@
...new PPageName().createOptions(),
};
```
+## 页面能力扩展
-### 页面能力扩展：跨页面通讯
+### 跨页面通讯
Taro 的跨页面通讯能力，仅小程序可用，非小城不能跨页通讯非常不方便
因此，使用 createOptions 创建合并对象时，给页面的 Vue 实例，增加了跨页面通讯的方法，兼容所有平台
@@ -171,37 +231,9 @@
}
```
-### 页面能扩展：跨端通讯
+### 跨端通讯
当我们进混合 APP 开发时，我们需要与 java 层进行通讯，使用 createOptions 创建合并对象时，增加了跨通讯的能力
-（更多跨端通讯明细待续）
+（TODO：更多跨端通讯明细待续）
-## 转换静态图片引用
-
-在目前项目体系设计下，由于不同项目（公众号、小程序、混合app）图片加载机制的不同，设置了一个统一的图片地址转换入口
-* 移动端的图片不能使用背景，只能使用 image 图片元素
-* 图片地址需经过静态方法 transAssets 转换而来
-* createOptions 的参数 dataAdd 中，如果包含 assets 属性，会自动调用 transAssets 全部转换
-
-例如：
-
-```HTML
-<template>
- <image :src="assets.homeNav1" mode="aspectFit" />
-</template>
-```
-
-```js
-export default {
- name: 'index',
- ...new PIndex().createOptions({
- // 首页菜单图片，会全部经过 transAssets 进行路径转换，转换为图片实际发布的地址
- assets: {
- homeNav1: 'assets/img/home-nav-01.png',
- homeNav2: 'assets/img/home-nav-02.png',
- homeNav3: 'assets/img/home-nav-03.png',
- },
- }),
-};
-```
--
Gitblit v1.9.1