docs: 添加 vue quick start

wjgogogo · wjgogogo · commit ca37fbadeccb · 2022-05-25T15:04:40.000+08:00
diff --git a/packages/s2-vue/README.md b/packages/s2-vue/README.md
@@ -336,10 +336,11 @@ const rawOptions: S2Options = {
 ### 2. 组件配置
 
 ```ts
+// App.vue
 <script lang="ts">
 import type { S2DataConfig, S2Options } from '@antv/s2';
+import { Sheet } from '@antv/s2-vue';
 import { defineComponent, onMounted, reactive, ref, shallowRef } from 'vue';
-import { Sheet } from '../src';
 
 export default defineComponent({
   setup() {
diff --git a/s2-site/docs/manual/getting-started.zh.md b/s2-site/docs/manual/getting-started.zh.md
@@ -181,7 +181,7 @@ s2.render()
 
 ### `React` 版本
 
-`S2` 提供了开箱即用的 `React` 版本 [表格组件](/zh/examples/gallery#category-表格组件)，还有配套丰富的 [分析组件](/zh/examples/gallery#category-Tooltip), 帮助开发者快速满足业务看数分析需求。
+`S2` 提供了开箱即用的 `React` 版本 [表格组件](/zh/examples/gallery#category-表格组件），还有配套丰富的 [分析组件](/zh/examples/gallery#category-Tooltip), 帮助开发者快速满足业务看数分析需求。
 
 使用 `React` 版本 `S2`，只有渲染这一步有所不同：
 
@@ -203,7 +203,59 @@ ReactDOM.render(
 
 ```
 
-​📊 查看 demo [React 版本透视表](/zh/examples/react-component/sheet#pivot)。
+### `Vue` 版本
+
+`S2` 同时也提供了开箱即用的 `Vue` 版本 [表格组件](###), 帮助开发者快速满足业务看数分析需求。
+
+使用 `Vue` 版本 `S2`：
+
+#### 表格组件使用
+
+```ts
+// App.vue
+<script lang="ts">
+import type { S2DataConfig, S2Options } from '@antv/s2';
+import { Sheet } from '@antv/s2-vue';
+import { defineComponent, onMounted, reactive, ref, shallowRef } from 'vue';
+
+export default defineComponent({
+  setup() {   
+    // dataCfg 数据字段较多，建议使用 shallow, 如果有数据更改直接替换整个对象
+    const dataCfg = shallowRef(s2DataConfig);
+    const options: S2Options = reactive(s2Options);
+
+    return {
+      dataCfg,
+      options,
+    };
+  },
+
+  components: {
+    Sheet,
+  },
+});
+</script>
+
+<template>
+  <Sheet :dataCfg="dataCfg" :options="options" />
+</template>
+
+<style lang="less">
+@import 'ant-design-vue/dist/antd.less';
+</style>
+```
+
+#### 渲染组件
+
+```ts
+import { createApp } from 'vue';
+import App from './App.vue';
+
+createApp(App).mount('#app');
+
+```
+
+​📊 查看 demo [Vue 版本透视表](###)。
 
 ## ⌨️ 本地开发
 
