docs: add guide of function component style (#10728)

packages/vant/docs/markdown/quickstart.en-US.md

@@ -172,6 +172,28 @@ const app = createApp();
 app.use(Button);
 ```
 
+#### 4. Style of Function Components
+
+Some components of Vant are provided as function, including `Toast`, `Dialog`, `Notify` and `ImagePreview`. When using function components, `unplugin-vue-components` can not auto import the component style, so we need to import style manually.
+
+```js
+// Toast
+import { Toast } from 'vant';
+import 'vant/es/toast/style';
+
+// Dialog
+import { Dialog } from 'vant';
+import 'vant/es/dialog/style';
+
+// Notify
+import { Notify } from 'vant';
+import 'vant/es/notify/style';
+
+// ImagePreview
+import { ImagePreview } from 'vant';
+import 'vant/es/image-preview/style';
+```
+
 > Vant supports tree shaking by default, so you don't necessarily need the webpack plugin, if you can't accept the full import of css.
 
 ### Import all components (not recommended)

packages/vant/docs/markdown/quickstart.zh-CN.md

@@ -173,7 +173,29 @@ const app = createApp();
 app.use(Button);
 ```
 
-> 注意：Vant 默认支持通过 Tree Shaking，因此你也可以不配置任何插件，直接通过 Tree Shaking 来移除不需要的 JS 代码，但 CSS 无法通过这种方式优化。
+#### 4. 引入函数组件的样式
+
+Vant 中有个别组件是以函数的形式提供的，包括 `Toast`，`Dialog`，`Notify` 和 `ImagePreview` 组件。在使用函数组件时，`unplugin-vue-components` 无法自动引入对应的样式，因此需要手动引入样式。
+
+```js
+// Toast
+import { Toast } from 'vant';
+import 'vant/es/toast/style';
+
+// Dialog
+import { Dialog } from 'vant';
+import 'vant/es/dialog/style';
+
+// Notify
+import { Notify } from 'vant';
+import 'vant/es/notify/style';
+
+// ImagePreview
+import { ImagePreview } from 'vant';
+import 'vant/es/image-preview/style';
+```
+
+> 注意：Vant 支持 Tree Shaking，因此你也可以不配置任何插件，通过 Tree Shaking 即可移除不需要的 JS 代码，但 CSS 无法通过这种方式优化。
 
 ### 导入所有组件（不推荐）