vue3中使用ant-design-vue

ant-design-vue官网：Ant Design Vue — An enterprise-class UI components based on Ant Design and Vue.jsAn enterprise-class UI components based on Ant Design and Vuehttps://www.antdv.com/components/overview-cn/

安装

npm i -S ant-design-vue

 引入

全局引入：

import Antd from "ant-design-vue"; import "ant-design-vue/dist/reset.css";  const app = createApp(App); app.use(Antd);

局部引入：

import "ant-design-vue/dist/reset.css"; import { Button } from "ant-design-vue";  const app = createApp(App); app.use(Button);

使用

<template>   <div>     <a-button>Default Button</a-button>     <a-button type="primary">Primary Button</a-button>     <a-button type="dashed">Dashed Button</a-button>     <a-button type="text">Text Button</a-button>     <a-button type="link">Link Button</a-button>      <a-button type="primary" shape="circle">       <template #icon>         <SearchOutlined />       </template>     </a-button>     <a-button shape="circle">A</a-button>     <a-button>       <template #icon>         <SearchOutlined />       </template>       Search     </a-button>   </div> </template>  <script setup lang="ts"> import { SearchOutlined } from '@ant-design/icons-vue'; </script>