1

vue/vue3_Ant框架.md

@@ -3,28 +3,37 @@
 > 此处是通过 vue cli 创建 vue3.0 项目,直接在项目目录下新增
 ### 1. 安装 ant to vue3
 通过 `yarn` 或者 `npm` 进行安装 `ant`
-
+<!-- tabs:start -->
+#### **yarn**
 ```shell
-    yarn  add ant-design-vue@next
-    
-    # OR
-    
+    yarn add ant-design-vue@next
+```
+#### **npm**
+```shell    
     npm i --save ant-design-vue@next
 ```
+<!-- tabs:end -->
 
+>[!Warning] 
+>如果是需要全局安装不要使用官方的方法来进行一个安装,在21-08-02 使用官方教程安装后使用  `vue3.0` 方法进行引用会在浏览器内提示 `Cannot read property 'use' of undefined` ,但是在终端中不会有错误提示, 使用上方方法安装,可正常使用
 
-<font color="red">!!! 如果是需要全局安装不要使用官方的方法来进行一个安装,在21-08-02 使用官方教程安装后使用  `vue3.0` 方法进行引用会在浏览器内提示 `Cannot read property 'use' of undefined` ,但是在终端中不会有错误提示, 使用上方方法安装,可正常使用 </font>
-`ant` 官方安装方法
-
+`ant`官方安装方法
+<!-- tabs:start -->
+#### **yarn**
 ```shell
-    npm install ant-design-vue --save
     yarn add ant-design-vue
 ```
+#### **npm**
+```shell
+    npm install ant-design-vue --save
+```
+<!-- tabs:end -->
 
 ### 2. `vue3` 中,配置 `ant`
 > 全局配置ant
 > 在vue3中全局挂载模块和vue2中有一点区别, 区别不大
-
+<!-- tabs:start -->
+### **vue3**
 编辑 `src` 目录下的 `main.js` ,使用 `app.use` 来进行导入,支持链式调用
 ```javascript
 import { createApp } from 'vue';
@@ -37,7 +46,9 @@ app.mount("#app");
 // 也可以按照下面方式进行引用,xxx为模块
 createApp(app).use(xxx).use(xxx).use(Antd)
 ```
-
+### ***vue2***
+没写
+<!-- tabs:end -->
 ## 递归渲染 `sidebar`
 #### 1. 思路解析
 侧边栏部分可以使用 `ant` 的布局 `Layout` 来实现,配合 `ant` 的导航菜单 `a-menu` 子菜单使用 `a-sub-menu` 来实现多层级