tmui-cli 2.0.6 → 5.3.2

package/data/uniappx/vue/options-api.md

@@ -503,14 +503,14 @@ export default {
 
 |  | 兼容性 | 描述 |
 | :- | :- | :- |
-| beforeCreate | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 在组件实例初始化完成之后立即调用。<br/>在实例初始化之后，数据观测 (data observer) 和 event/watcher 事件配置之前被调用。 |
-| created | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 在组件实例处理完所有与状态相关的选项后调用。<br/>在这一步，实例已完成以下的配置：数据观测 (data observer)，属性和方法的运算，watch/event 事件回调。<br/>然而，此时挂载阶段还未开始，因此 $el 属性仍不可用。 |
-| beforeMount | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 在组件被挂载之前调用。<br/>相关的 render 函数首次被调用。<br/>当这个钩子被调用时，组件已经完成了其响应式状态的设置，但还没有创建 DOM 节点。<br/>它即将首次执行 DOM 渲染过程。 |
-| mounted | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 在组件被挂载之后调用。<br/>el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用该钩子。<br/>如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.$el 也在文档内。 |
-| beforeUpdate | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 在组件即将因为一个响应式状态变更而更新其 DOM 树之前调用。<br/>数据更新时调用，发生在虚拟 DOM 打补丁之前。<br/>这里适合在更新之前访问现有的 DOM，比如手动移除已添加的事件监听器。 |
-| updated | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 在组件因为一个响应式状态变更而更新其 DOM 树之后调用。<br/>父组件的更新钩子将在其子组件的更新钩子之后调用。<br/>这个钩子会在组件的任意 DOM 更新后被调用，这些更新可能是由不同的状态变更导致的。<br/>如果你需要在某个特定的状态更改后访问更新后的 DOM，请使用 nextTick() 作为替代。 |
-| beforeUnmount | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 在一个组件实例被卸载之前调用。<br/>当这个钩子被调用时，组件实例依然还保有全部的功能。 |
-| unmounted | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 在一个组件实例被卸载之后调用。<br/>可以在这个钩子中手动清理一些副作用，例如计时器、DOM 事件监听器或者与服务器的连接。 |
+| beforeCreate | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 在组件实例初始化完成之后立即调用。<br/>在实例初始化之后，数据观测 (data observer) 和 event/watcher 事件配置之前被调用。 |
+| created | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 在组件实例处理完所有与状态相关的选项后调用。<br/>在这一步，实例已完成以下的配置：数据观测 (data observer)，属性和方法的运算，watch/event 事件回调。<br/>然而，此时挂载阶段还未开始，因此 $el 属性仍不可用。 |
+| beforeMount | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 在组件被挂载之前调用。<br/>相关的 render 函数首次被调用。<br/>当这个钩子被调用时，组件已经完成了其响应式状态的设置，但还没有创建 DOM 节点。<br/>它即将首次执行 DOM 渲染过程。 |
+| mounted | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 在组件被挂载之后调用。<br/>el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用该钩子。<br/>如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.$el 也在文档内。 |
+| beforeUpdate | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 在组件即将因为一个响应式状态变更而更新其 DOM 树之前调用。<br/>数据更新时调用，发生在虚拟 DOM 打补丁之前。<br/>这里适合在更新之前访问现有的 DOM，比如手动移除已添加的事件监听器。 |
+| updated | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 在组件因为一个响应式状态变更而更新其 DOM 树之后调用。<br/>父组件的更新钩子将在其子组件的更新钩子之后调用。<br/>这个钩子会在组件的任意 DOM 更新后被调用，这些更新可能是由不同的状态变更导致的。<br/>如果你需要在某个特定的状态更改后访问更新后的 DOM，请使用 nextTick() 作为替代。 |
+| beforeUnmount | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 在一个组件实例被卸载之前调用。<br/>当这个钩子被调用时，组件实例依然还保有全部的功能。 |
+| unmounted | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 在一个组件实例被卸载之后调用。<br/>可以在这个钩子中手动清理一些副作用，例如计时器、DOM 事件监听器或者与服务器的连接。 |
 | errorCaptured | Web 4.0 / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 在捕获了后代组件传递的错误时调用。<br/>这个钩子带有三个实参：错误对象、触发该错误的组件实例，以及一个说明错误来源类型的信息字符串。<br/>这个钩子可以通过返回 false 来阻止错误继续向上传递。 |
 | renderTracked | Web 4.0 / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 在一个响应式依赖被组件的渲染作用追踪后调用。<br/>跟踪虚拟 DOM 重新渲染时调用。钩子接收 debugger event 作为参数。<br/>此事件告诉你哪个操作跟踪了组件以及该操作的目标对象和键。 |
 | renderTriggered | Web 4.0 / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 在一个响应式依赖被组件触发了重新渲染之后调用。<br/>当虚拟 DOM 重新渲染为 triggered.Similarly 为renderTracked，接收 debugger event 作为参数。<br/>此事件告诉你是什么操作触发了重新渲染，以及该操作的目标对象和键。 |

package/data/uniappx/web/README.md

@@ -9,7 +9,7 @@
 web版默认有页面滚动；app平台vdom模式时没有页面滚动，但蒸汽模式时已经支持页面滚动了。所以从蒸汽开始，这点平台差异不再存在。
 
 - 与老uni-app x相比，uni-app x 编译到web平台时，有几处不同：
-1. 如果使用uts代码，会走uts2js逻辑，会注入UTSJSONObject。如果使用ts/js则无法使用UTSJSONObject。
+1. 如果使用uts代码，会走[uts2js](../uts/uts2js.md)逻辑，会注入UTSJSONObject。如果使用ts/js则无法使用UTSJSONObject。
 2. 重置了css，拉齐App布局引擎，比如统一使用flex布局。详见[css重置](../css/README.md#css-reset)
 
 ## web运行失败注意事项@faq
@@ -146,15 +146,11 @@ position: fixed定位时，web端为相对于整个浏览器页面进行定位
   height: 100px;
   background-color: #FF0000;
   left: 10px;
-  /* #ifdef WEB */
   /*
    * HBuilderX 4.52之前只能使用--window-top，不可使用--uni-safe-area-inset-top
+	 * App端蒸汽模式5.31+起支持calc
    */
   top: calc(--uni-safe-area-inset-top + 10px);
-  /* #endif */
-  /* #ifdef APP */
-  top: 10px;  /* App端暂不支持calc */
-  /* #endif */
 }
 ```
 

package/data/uniappx/web/ssr.md

@@ -42,7 +42,9 @@ export default defineConfig({
 
 **示例**
 
-```ts
+下面示例假设 `@/store/index.uts` 已导出 `useItemsStore`，包含按 ID 保存数据的 `items` 状态和异步 `fetchItem(id)` 方法。SSR 配置见下方 [Pinia](#pinia) 章节。
+
+```vue
 <template>
   <text v-if="item">{{ item.title }}</text>
   <text v-else>...</text>
@@ -58,80 +60,37 @@ export default defineConfig({
 const categories = ssrRef(['c1', 'c2'], 'categories');
 ```
 
-#### vuex
+#### Pinia
 
-对于复杂的数据，如需保持云端客户端一致，建议使用vuex进行存储。下面是一个简单的示例：
+Pinia 的引入和 store 定义见[全局变量与状态管理](../tutorial/store.md#pinia)。SSR 时需为每次请求创建独立的 Pinia 实例，并返回以下 `store` 适配对象，以同步服务端和客户端状态：
 
 **main.uts**
 
 ```ts
 import { createSSRApp } from 'vue'
+import { createPinia } from 'pinia'
+import type { StateTree } from 'pinia'
 import App from './App.uvue'
-import createStore from './store'
+
 export function createApp() {
   const app = createSSRApp(App)
-
-  const store = createStore() // 创建 store
-  app.use(store)
+  const pinia = createPinia()
+  app.use(pinia)
 
   return {
     app,
-    store,// 必须返回 store
-  }
-}
-```
-
-**store/index.uts**
-
-```ts
-import { createStore } from 'vuex'
-
-// 模拟接口获取数据
-function fetchItem(id) {
-  return new Promise((resolve) => {
-    setTimeout(() => {
-      resolve({
-        id,
-        title: 'title' + id,
-      })
-    }, 300)
-  })
-}
-
-export default () => {
-  return createStore({
-    state() {
-      return {
-        items: {},
-      }
-    },
-    actions: {
-      fetchItem({ commit }, id) {
-        return fetchItem(id).then((item) => {
-          commit('setItem', { id, item })
-        })
+    store: {
+      get state() {
+        return pinia.state.value
       },
-    },
-    mutations: {
-      setItem(state, { id, item }) {
-        state.items[id] = item
+      replaceState(state: Record<string, StateTree>) {
+        pinia.state.value = state
       },
     },
-  })
+  }
 }
 ```
 
-**pages/index/index.uvue**
-
-```vue
-<template>
-  <text v-if="item">{{ item.title }}</text>
-  <text v-else>...</text>
-  <text>{{ JSON.stringify(categories) }}</text>
-</template>
-
-```
-
 #### page-meta
 
 uni-app-x内page-meta仅保留了存放head的功能，page-meta内的head节点在最终渲染时会传送到html的head内，可用于存放keyword、description等信息
@@ -226,7 +185,7 @@ uni-app-x内page-meta仅保留了存放head的功能，page-meta内的head节点
 
 ### 注意事项
 
-- 浏览器控制台提示如下警告，说明服务器和客户端渲染的结果不一致，检查模板绑定的属性是否使用了 `ssrRef`
+- 浏览器控制台提示如下警告，说明服务器和客户端渲染的结果不一致，检查模板绑定的状态是否通过 `ssrRef` 或上述 Pinia SSR 方式同步
 
 ```
 [Vue warn]: Hydration node mismatch: