📝 docs(mp-html): add mp-html component documentation

- create mp-html.md with detailed component documentation
- include feature introduction, installation methods, properties, events and plugins

📝 docs(prd): update common problem implementation method

- specify using mp-html component for HTML content display in common problems
- add reference to mp-html documentation in relevant PRD sections

docs/mp-html.md

@@ -0,0 +1,241 @@
+# mp-html
+
+> 一个强大的小程序富文本组件
+
+![star](https://img.shields.io/github/stars/jin-yufeng/mp-html)
+![forks](https://img.shields.io/github/forks/jin-yufeng/mp-html)
+[![npm](https://img.shields.io/npm/v/mp-html)](https://www.npmjs.com/package/mp-html)
+![downloads](https://img.shields.io/npm/dt/mp-html)
+[![Coverage Status](https://coveralls.io/repos/github/jin-yufeng/mp-html/badge.svg?branch=master)](https://coveralls.io/github/jin-yufeng/mp-html?branch=master)
+![license](https://img.shields.io/github/license/jin-yufeng/mp-html)
+[![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+
+## 功能介绍
+- 支持在多个主流的小程序平台和 `uni-app` 中使用
+- 支持丰富的标签（包括 `table`、`video`、`svg` 等）
+- 支持丰富的事件效果（自动预览图片、链接处理等）
+- 支持设置占位图（加载中、出错时、预览时）
+- 支持锚点跳转、长按复制等丰富功能
+- 支持大部分 *html* 实体
+- 丰富的插件（关键词搜索、内容编辑、`latex` 公式等）
+- 效率高、容错性强且轻量化（`≈25KB`，`9KB gzipped`）
+
+查看 [功能介绍](https://jin-yufeng.github.io/mp-html/#/overview/feature) 了解更多
+
+## 使用方法
+### 原生平台
+- `npm` 方式
+  1. 在项目目录下安装组件包
+
+     ```bash
+     npm install mp-html
+     ```
+  2. 开发者工具中勾选 `使用 npm 模块`（若没有此选项则不需要）并点击 `工具 - 构建 npm`
+  3. 在需要使用页面的 `json` 文件中添加
+
+     ```json
+     {
+       "usingComponents": {
+         "mp-html": "mp-html"
+       }
+     }
+     ```
+  4. 在需要使用页面的 `wxml` 文件中添加
+
+     ```html
+     <mp-html content="{{html}}" />
+     ```
+  5. 在需要使用页面的 `js` 文件中添加
+
+     ```javascript
+     Page({
+       onLoad () {
+         this.setData({
+           html: '<div>Hello World!</div>'
+         })
+       }
+     })
+     ```
+- 源码方式
+  1. 将源码中对应平台的代码包（`dist/platform`）拷贝到 `components` 目录下，更名为 `mp-html`
+  2. 在需要使用页面的 `json` 文件中添加
+
+     ```json
+     {
+       "usingComponents": {
+         "mp-html": "/components/mp-html/index"
+       }
+     }
+     ```
+  
+  后续步骤同上
+
+查看 [快速开始](https://jin-yufeng.github.io/mp-html/#/overview/quickstart) 了解更多
+
+### uni-app
+- 源码方式
+  1. 将源码中 `dist/uni-app` 内的内容拷贝到项目根目录下  
+     可以直接通过 [插件市场](https://ext.dcloud.net.cn/plugin?id=805) 引入
+  2. 在需要使用页面的 `vue` 文件中添加
+
+     ```vue
+     <template>
+       <view>
+         <mp-html :content="html" />
+       </view>
+     </template>
+     <script>
+       import mpHtml from '@/components/mp-html/mp-html'
+       export default {
+         // HBuilderX 2.5.5+ 可以通过 easycom 自动引入
+         components: {
+           mpHtml
+         },
+         data () {
+           return {
+             html: '<div>Hello World!</div>'
+           }
+         }
+       }
+     </script>
+     ```
+- `npm` 方式
+  1. 在项目目录下安装组件包
+
+     ```bash
+     npm install mp-html
+     ```
+  2. 在需要使用页面的 `vue` 文件中添加
+
+     ```vue
+     <template>
+       <view>
+         <mp-html :content="html" />
+       </view>
+     </template>
+     <script>
+       import mpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html'
+       export default {
+         // 不可省略
+         components: {
+           mpHtml
+         },
+         data () {
+           return {
+             html: '<div>Hello World!</div>'
+           }
+         }
+       }
+     </script>
+     ```
+
+  使用 `cli` 方式运行的项目，通过 `npm` 方式引入时，需要在 `vue.config.js` 中配置 `transpileDependencies`，详情可见 [#330](https://github.com/jin-yufeng/mp-html/issues/330#issuecomment-913617687)  
+  如果在 `nvue` 中使用还要将 `dist/uni-app/static` 目录下的内容拷贝到项目的 `static` 目录下，否则无法运行  
+
+查看 [快速开始](https://jin-yufeng.github.io/mp-html/#/overview/quickstart) 了解更多
+
+## 组件属性
+
+| 属性 | 类型 | 默认值 | 说明 |
+|:---:|:---:|:---:|---|
+| container-style | String |  | 容器的样式（[2.1.0+](https://jin-yufeng.github.io/mp-html/#/changelog/changelog#v210)） |
+| content | String |  | 用于渲染的 html 字符串 |
+| copy-link | Boolean | true | 是否允许外部链接被点击时自动复制 |
+| domain | String |  | 主域名（用于链接拼接） |
+| error-img | String |  | 图片出错时的占位图链接 |
+| lazy-load | Boolean | false | 是否开启图片懒加载 |
+| loading-img | String |  | 图片加载过程中的占位图链接 |
+| pause-video | Boolean | true | 是否在播放一个视频时自动暂停其他视频 |
+| preview-img | Boolean | true | 是否允许图片被点击时自动预览 |
+| scroll-table | Boolean | false | 是否给每个表格添加一个滚动层使其能单独横向滚动 |
+| selectable | Boolean | false | 是否开启文本长按复制 |
+| set-title | Boolean | true | 是否将 title 标签的内容设置到页面标题 |
+| show-img-menu | Boolean | true | 是否允许图片被长按时显示菜单 |
+| tag-style | Object |  | 设置标签的默认样式 |
+| use-anchor | Boolean | false | 是否使用锚点链接 |
+
+查看 [属性](https://jin-yufeng.github.io/mp-html/#/basic/prop) 了解更多
+
+## 组件事件
+
+| 名称 | 触发时机 |
+|:---:|---|
+| load | dom 树加载完毕时 |
+| ready | 图片加载完毕时 |
+| error | 发生渲染错误时 |
+| imgtap | 图片被点击时 |
+| linktap | 链接被点击时 |
+
+查看 [事件](https://jin-yufeng.github.io/mp-html/#/basic/event) 了解更多
+
+## api
+组件实例上提供了一些 `api` 方法可供调用
+
+| 名称 | 作用 |
+|:---:|---|
+| in | 将锚点跳转的范围限定在一个 scroll-view 内 |
+| navigateTo | 锚点跳转 |
+| getText | 获取文本内容 |
+| getRect | 获取富文本内容的位置和大小 |
+| setContent | 设置富文本内容 |
+| imgList | 获取所有图片的数组 |
+| pauseMedia | 暂停播放音视频（[2.2.2+](https://jin-yufeng.github.io/mp-html/#/changelog/changelog#v222)） |
+| setPlaybackRate | 设置音视频播放速率（[2.4.0+](https://jin-yufeng.github.io/mp-html/#/changelog/changelog#v240)） |
+
+查看 [api](https://jin-yufeng.github.io/mp-html/#/advanced/api) 了解更多
+
+## 插件扩展  
+除基本功能外，本组件还提供了丰富的扩展，可按照需要选用
+
+| 名称 | 作用 |
+|:---:|---|
+| audio | 音乐播放器 |
+| editable | 富文本编辑 |
+| emoji | 解析 emoji |
+| highlight | 代码块高亮显示 |
+| markdown | 渲染 markdown |
+| search | 关键词搜索 |
+| style | 匹配 style 标签中的样式 |
+| txv-video | 使用腾讯视频 |
+| img-cache | 图片缓存 by [@PentaTea](https://github.com/PentaTea) |
+| latex | 渲染 latex 公式 by [@Zeng-J](https://github.com/Zeng-J) |
+| card | 卡片展示 by [@whoooami](https://github.com/whoooami) |
+
+查看 [插件](https://jin-yufeng.github.io/mp-html/#/advanced/plugin) 了解更多
+
+## 许可与支持
+- 许可  
+  您可以免费的使用（包括商用）、复制或修改本组件 [MIT License](https://github.com/jin-yufeng/mp-html/blob/master/LICENSE)  
+  在用于生产环境前务必经过充分测试，由插件 `bug` 带来的损失概不负责（可以自行修改源码）  
+
+- 联系  
+  欢迎加入 `QQ` 交流群：  
+  群1（已满）：`699734691`  
+  群2（已满）：`778239129`  
+  群3：`960265313`  
+
+## 更新日志
+- v2.5.1 (20250420)
+  1. `U` `uni-app` 包适配鸿蒙 `APP` [详细](https://github.com/jin-yufeng/mp-html/issues/615)
+  2. `U` 微信小程序替换废弃 `api` `getSystemInfoSync` [详细](https://github.com/jin-yufeng/mp-html/issues/613)
+  3. `F` 修复了微信小程序 `glass-easel` 框架下真机换行异常的问题 [详细](https://github.com/jin-yufeng/mp-html/pull/607) by [@PaperStrike](https://github.com/PaperStrike)
+  4. `F` 修复了 `uni-app` 包 `app` 端播放视频可能报错的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/617)
+  5. `F` 修复了 `latex` 插件可能出现 `xxx can be used only in display mode` 的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/632)
+  6. `F` 修复了 `uni-app` 包 `latex` 公式可能不显示的问题  [#599](https://github.com/jin-yufeng/mp-html/issues/599)、[#627](https://github.com/jin-yufeng/mp-html/issues/627)
+
+- v2.5.0 (20240422)
+  1. `U` `play` 事件增加返回 `src` 等信息 [详细](https://github.com/jin-yufeng/mp-html/issues/526)
+  2. `U` `preview-img` 属性支持设置为 `all` 开启 `base64` 图片预览 [详细](https://github.com/jin-yufeng/mp-html/issues/536)
+  3. `U` `editable` 插件增加简易模式（点击文字直接编辑）
+  4. `U` `latex` 插件支持块级公式 [详细](https://github.com/jin-yufeng/mp-html/issues/582)
+  5. `F` 修复了表格部分情况下背景丢失的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/587)
+  6. `F` 修复了部分 `svg` 无法显示的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/591)
+  7. `F` 修复了 `uni-app` 包 `h5` 和 `app` 端部分情况下样式无法识别的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/518)
+  8. `F` 修复了 `latex` 插件部分情况下显示不正确的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/580)
+  9. `F` 修复了 `editable` 插件表格无法删除的问题
+  10. `F` 修复了 `editable` 插件 `uni-app` 包 `vue3` `h5` 端点击图片报错的问题
+  11. `F` 修复了 `editable` 插件 `uni-app` 包点击表格没有菜单栏的问题
+
+  从 `1.x` 的升级方法可见 [更新指南](https://jin-yufeng.github.io/mp-html/#/changelog/changelog?id=v200)
+
+查看 [更新日志](https://jin-yufeng.github.io/mp-html/#/changelog/changelog) 了解更多

docs/prd/epic-007-mini-program-ux-optimization.md

@@ -34,7 +34,7 @@
 **What's being added/changed:**
 1. **微信客服功能优化** - 实现通过API直接打开微信客服
    - 替换现有的"功能开发中..."提示
-   - 使用微信官方API `wx.openCustomerServiceChat`
+   - 使用微信官方API `Taro.openCustomerServiceChat`
    - 配置企业ID和客服链接到环境变量
    - 添加错误处理和降级方案
 
@@ -46,7 +46,7 @@
 3. **常见问题功能优化** - 实现弹窗显示富文本内容
    - 替换现有的"功能开发中..."提示
    - 使用Dialog组件显示富文本内容
-   - 支持HTML格式的常见问题内容
+   - 使用mp-html组件（参考docs/mp-html.md）支持HTML格式的常见问题内容
    - 提升用户体验和操作便利性
 
 4. **购票页面优化** - 暂时隐藏出发日期选择功能
@@ -100,7 +100,7 @@
 3. **Story 3:** 常见问题功能优化
    - 实现弹窗显示富文本内容
    - 使用Dialog组件显示常见问题
-   - 支持HTML格式的内容显示
+   - 使用mp-html组件（参考docs/mp-html.md）支持HTML格式的内容显示
    - 验证常见问题功能正常工作
 
 4. **Story 4:** 购票页面优化
@@ -167,9 +167,9 @@
 - 关键兼容性要求：保持现有API不变，UI变更遵循现有设计模式
 - 每个故事必须包含验证现有功能保持完整的检查
 - 技术细节：
-  - 微信客服：使用 `wx.openCustomerServiceChat` API，配置环境变量中的企业ID和客服链接
+  - 微信客服：使用 `Taro.openCustomerServiceChat` API，配置环境变量中的企业ID和客服链接
   - 个人资料：用户无头像时显示 `mini/images/default_avatar.jpg`，用户名统一显示"普通用户"
-  - 常见问题：使用现有的Dialog组件显示富文本内容
+  - 常见问题：使用现有的Dialog组件显示富文本内容，使用mp-html组件（参考docs/mp-html.md）
   - 购票页面：暂时隐藏出发日期选择功能
   - 首页：在环境变量中添加默认目的地配置，自动使用配置的省市区ID
   - 活动选择：暂时移除活动图片占位符显示