officialblock 1.7.0 → 1.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +35 -0
- package/dist/official-block.cjs.js +6 -6
- package/dist/official-block.es.js +5701 -5508
- package/dist/official-block.umd.js +6 -6
- package/dist/style.css +1 -1
- package/package.json +3 -1
package/README.md
CHANGED
|
@@ -133,6 +133,41 @@ console.log('是否为桌面:', device?.isDesktop)
|
|
|
133
133
|
- `$device.isMobileOrTablet`: 是否为移动设备或平板 (宽度 < 1024px)
|
|
134
134
|
- `$device.isDesktop`: 是否为桌面设备 (宽度 ≥ 1024px)
|
|
135
135
|
|
|
136
|
+
### SSR 支持（Nuxt 3）
|
|
137
|
+
|
|
138
|
+
OfficialBlock 完全支持服务端渲染（SSR）！
|
|
139
|
+
|
|
140
|
+
```typescript
|
|
141
|
+
// plugins/officialblock.client.ts
|
|
142
|
+
import OfficialBlock from 'officialblock'
|
|
143
|
+
import 'officialblock/style.css'
|
|
144
|
+
|
|
145
|
+
export default defineNuxtPlugin((nuxtApp) => {
|
|
146
|
+
nuxtApp.vueApp.use(OfficialBlock)
|
|
147
|
+
})
|
|
148
|
+
```
|
|
149
|
+
|
|
150
|
+
对于包含浏览器专属功能的组件（如富文本编辑器、轮播图），使用 `<ClientOnly>` 包裹：
|
|
151
|
+
|
|
152
|
+
```vue
|
|
153
|
+
<template>
|
|
154
|
+
<div>
|
|
155
|
+
<!-- 普通组件可以直接使用 -->
|
|
156
|
+
<BannerImage :modelValue="bannerData" />
|
|
157
|
+
|
|
158
|
+
<!-- 包含浏览器专属功能的组件 -->
|
|
159
|
+
<ClientOnly>
|
|
160
|
+
<RichTextEditor v-model="content" />
|
|
161
|
+
<HeroSlide :modelValue="slideData" />
|
|
162
|
+
</ClientOnly>
|
|
163
|
+
</div>
|
|
164
|
+
</template>
|
|
165
|
+
```
|
|
166
|
+
|
|
167
|
+
📚 详细文档：
|
|
168
|
+
- [SSR 支持文档](./docs/SSR_SUPPORT.md) - 完整的 SSR 支持说明
|
|
169
|
+
- [Nuxt 3 使用指南](./docs/NUXT_USAGE.md) - 在 Nuxt 3 项目中的详细使用示例
|
|
170
|
+
|
|
136
171
|
### TypeScript Support
|
|
137
172
|
|
|
138
173
|
This package includes TypeScript definitions.
|