From b8a41c1e8b4d209b5041fe8e2598a06cccc84aaf Mon Sep 17 00:00:00 2001
From: brightzoe <brightzoe@qq.com>
Date: Fri, 21 Jun 2024 18:05:28 +0800
Subject: [PATCH] docs: update

---
 blog/gpt-prompt.md                            | 40 +++++++++++++++++++
 .../specific/dynamic-form-generator.md        | 17 +++++++-
 docs/fe-basic/javascript/es6/promise.md       | 21 ++++++++++
 docs/react/advanced-react/useeffect.md        |  4 +-
 docusaurus.config.ts                          |  5 +--
 5 files changed, 81 insertions(+), 6 deletions(-)
 create mode 100644 blog/gpt-prompt.md

diff --git a/blog/gpt-prompt.md b/blog/gpt-prompt.md
new file mode 100644
index 000000000..baf56d613
--- /dev/null
+++ b/blog/gpt-prompt.md
@@ -0,0 +1,40 @@
+# gpt 学习
+
+## 利用chatgpt思维最大发挥优势
+
+- 提供充足的背景和知识。
+- 提供工具武装。插件：浏览网页或者数学计算等
+- 允许回溯和反思。在回答完问题后，继续询问你觉得回答是准确的吗？是否完成我的要求？
+- 对于复杂问题，激发慢思维模式。
+  - 因为chatgpt本质上是通过token去思考的，所以让他有更多token完成回答。可以将复杂任务拆解为多个小任务，使每个任务都有足够的token
+  - 给出一个示例提示让他模仿思维过程
+  - 告诉模型step by step
+- 要求chatgpt成功
+  - 根据期望chatgpt完成的任务，告诉他你是这个领域的专家，让他以专家视角给你输出结果
+
+## prompt
+
+完整的提示词结构： 指令词+上下文+输入内容+输出要求
+
+## 提出合格的问题
+
+- 设定用户的角色与设定ChatGpt的角色。
+- 明确问题，让问题更具体和明确。
+- 提供背景信息和上下文。
+- 如果需要丰富的信息可以采用开放式问题引导对话。
+- 针对复杂问题，可以以简单的问题作为开端并逐渐深入。
+- 如果对某个答案不理解或需要更多信息，可以要求提供具体示例或进一步解释。
+
+## 一些技巧
+
+- 明确背景和身份。比如：我是个正在学习xx的初学者，希望对xx进行xx,请告诉我使用哪些工具辅助分析
+- 限制回答长度。告诉他你期望的回答长度，（但长度不一定准确。）
+- 让他一步一步思考。尤其是在一些复杂问题或者逻辑/数学问题上。
+- 明确要求和目的。而不只是给出材料。
+- 让gpt给你提供思考方向。比如面对一些难题或者创造性问题，让gpt进行头脑风暴给你提供思路和方向。
+- 让gpt承担工作流中的某个角色。
+-
+
+## Reference
+
+- [🚀 提升与ChatGPT对话能力的七个技巧 | ChatGPT最佳中文学习网站](https://www.bookai.top/docs/ChatGPT-tutorial/%E6%8F%90%E5%8D%87%E4%B8%8EChatGPT%E5%AF%B9%E8%AF%9D%E8%83%BD%E5%8A%9B%E7%9A%84%E4%B8%83%E4%B8%AA%E6%8A%80%E5%B7%A7)
diff --git a/docs/business/specific/dynamic-form-generator.md b/docs/business/specific/dynamic-form-generator.md
index 6de8ec598..32bbcfc9f 100644
--- a/docs/business/specific/dynamic-form-generator.md
+++ b/docs/business/specific/dynamic-form-generator.md
@@ -4,7 +4,7 @@
 
 ## 需求闭环，完整链路
 
-设计表单->schema->表单预览->表单编辑填写->表单数据提交->表单数据回收分析生成完整报告
+设计表单->生成schema->表单预览->表单编辑填写->表单数据提交->表单数据回收分析生成完整报告
 
 ## 可扩展的组件库
 
@@ -27,7 +27,16 @@
 
 ### 组件交互能力
 
-跳转链接等
+比如跳转链接等能力，通过富文本编辑器实现。
+
+动态表单中的组件交互为表单关联能力，例如表单前后项的关联关系，某些表单项需要在什么条件下才会显示。这里想到两种方式来实现关联关系。
+
+- 第一种，是通过控制的思想来实现。将存在关联关系的组件分为两种角色：控制者和被控制者。控制者设置满足哪些条件则显示被控制者。在这种思想下，一个控制者可以控制多个被控制者。
+  - 优点：简单易懂，逻辑清晰。
+  - 缺点：控制逻辑单一，复杂情况下灵活性不足。
+- 第二种，通过依赖的思想来实现。每个问题可以设置自己满足什么条件才能够显示。这样可以设置多个依赖，也可以灵活设置各个依赖之间的关系。
+  - 优点：灵活性高，可配置性强。每个问题都可以单独设置自己的依赖。
+  - 缺点：依赖关系复杂时，导致逻辑难以维护。
 
 ### 组件通信能力
 
@@ -41,3 +50,7 @@
 - vuex/redux 等公共状态管理
 - iframe postmessage
 - event emitters
+
+## 更多
+
+一篇相似业务的总结和实现：[星创编辑器在投放业务中的落地｜得物技术](https://mp.weixin.qq.com/s?__biz=MzkxNTE3ODU0NA==&mid=2247525615&idx=1&sn=6b23091e2937e1c7e3009a0884772b57&chksm=c16131b0f616b8a6720c24f1cf803fe10d88198572c856505f2ef4e54c4920aa26ff97325b38&scene=21#wechat_redirect)
diff --git a/docs/fe-basic/javascript/es6/promise.md b/docs/fe-basic/javascript/es6/promise.md
index 2250194fc..949bbe935 100644
--- a/docs/fe-basic/javascript/es6/promise.md
+++ b/docs/fe-basic/javascript/es6/promise.md
@@ -4,8 +4,12 @@
 
 异步操作，通过回调函数实现，下面的操作依赖上一个回调的结果。则下面的操作都要写在上面的回调里面，回调里面嵌套回调，以致产生回调地狱。
 
+为了使处理异步操作的代码更简洁、可读，重点在于处理异步操作的成功和失败。
+
 ## 特点
 
+**状态机**的思想。
+
 - Promise 对象代表一个异步操作，包含三种状态：pending fulfilled rejected。只有异步操作的结果才可以决定当前 promise 的状态。
 - 状态已经改变就不会变。由 pending->fulfilled 或者 pending->rejected。
 
@@ -308,6 +312,22 @@ Promise.allSettled([Promise.reject(1), Promise.resolve(2)]).then((res) =>
 );
 ```
 
+## 为什么没有取消？
+
+设计哲学 ：简化异步操作，状态机的设计思想。
+
+取消需要考虑的点：
+
+- 状态机中更多的状态转换和边界情况。
+  - 可能会存在状态转换冲突。同时转换到cancel/resolved ，是否有优先级冲突？
+  - 异步操作一般伴随一些副作用，比如文件读写网络请求等，需要清理资源等，在实现上会增加复杂性。
+
+### 实现取消
+
+- 比如 fetch 等的AbortController.
+
+- 扩展原生Promise类。
+
 ## 请求并发
 
 ### 为什么需要
@@ -370,3 +390,4 @@ await 只在 async 函数内工作。
 ## Reference
 
 - [Promise 中的三兄弟 .all(), .race(), .allSettled() - 掘金](https://juejin.cn/post/6844903912592375821#heading-7)
+- [Promise：为什么没有取消？ - 掘金](https://juejin.cn/post/7373986431850872869)
diff --git a/docs/react/advanced-react/useeffect.md b/docs/react/advanced-react/useeffect.md
index e0623a8cb..6c0c2d6af 100644
--- a/docs/react/advanced-react/useeffect.md
+++ b/docs/react/advanced-react/useeffect.md
@@ -173,7 +173,9 @@ render(<Counter />);
 
 **useLayloutEffect**
 
-useLayoutEffect 会在所有 dom 变更之后同步调用 effect，适合用来读取 dom 布局并同步触发重渲染。在浏览器执行绘制之前，useLayoutEffect 内部的更新计划将被同步刷新。 :::
+useLayoutEffect 会在所有 dom 变更之后同步调用 effect，适合用来读取 dom 布局并同步触发重渲染。在浏览器执行绘制之前，useLayoutEffect 内部的更新计划将被同步刷新。
+
+:::
 
 执行顺序见下面的栗子：
 
diff --git a/docusaurus.config.ts b/docusaurus.config.ts
index 36ced50c5..f70d00ce8 100644
--- a/docusaurus.config.ts
+++ b/docusaurus.config.ts
@@ -2,8 +2,7 @@ import type { Config } from '@docusaurus/types';
 import type * as Preset from '@docusaurus/preset-classic';
 
 // Note: type annotations allow type checking and IDEs autocompletion
-import {themes as prismThemes} from 'prism-react-renderer'
-
+import { themes as prismThemes } from 'prism-react-renderer';
 
 const config: Config = {
   title: "brightzoe's blog",
@@ -143,7 +142,7 @@ const config: Config = {
           label: '工具',
           position: 'left',
         },
-        { to: '/blog', label: 'Blog', position: 'left' },
+        { to: '/blog/archive', label: 'Blog', position: 'left' },
         {
           href: 'https://github.com/brightzoe',
           // label: "GitHub",