安装 AntDesign
Siona
安装 AntDesign
1. 安装
$ npm install ant-design-vue@4.x --save
# or yarn
$ yarn add ant-design-vue@4.x
2. 注册
（1）全局完整注册
// main.ts
import { createApp } from 'vue';
import Antd from 'ant-design-vue';
import App from './App';
import 'ant-design-vue/dist/reset.css';
const app = createApp(App);
app.use(Antd).mount('#app');
以上代码便完成了 Antd 的全局注册。需要注意的是，样式文件需要单独引入。
（2）全局部分注册
// main.ts
import { createApp } from 'vue';
import { Button, message } from 'ant-design-vue';
import App from './App';
const app = createApp(App);
/* 会自动注册 Button 下的子组件, 例如 Button.Group */
app.use(Button).mount('#app');
app.config.globalProperties.$message = message;
（3）局部注册组件
此种方式需要分别注册组件子组件，如 Button、ButtonGroup，并且注册后仅在当前组件中有效。所以我们推荐使用上述两种方式。
<template>
<a-button>Add</a-button>
</template>
<script>
import {Button} from 'ant-design-vue';
const ButtonGroup = Button.Group;
export default {
components: {
AButton: Button,
AButtonGroup: ButtonGroup,
},
};
</script>