In the previous article, we introduced how to create a Vue CLI project using Vue3 (Part 1). Next, we will continue to expand the content of the following article based on the previous article. 1. Integrate Ant Design VueSQL: npm install [email protected] --save compatibility: If you need to support For IE series browsers, support for 2. Use of componentsOfficial website address: https://2x.antdv.com/docs/vue/getting-started-cn 1. Full citationModify the content in main.ts as follows: ts import { createApp } from 'vue'; import Antd from 'ant-design-vue'; import App from './App.vue'; import 'ant-design-vue/dist/antd.css'; import router from './router'; import store from './store'; //The advantage is that it is easy to develop, but the disadvantage is that the file will be larger when packaged (but it does not affect anything) createApp(App).use(store).use(router).use(Antd).mount('#app') 2. Component reference After the complete import, we can use the components happily. If you have used 3. Component Usage Examples Let's add a button to the 1. We make changes on the home pageHTML: <template> <div class="home"> <a-button type="primary" danger>Primary</a-button> <img alt="Vue logo" src="../assets/logo.png"> <HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/> </div> </template> <script lang="ts"> import { defineComponent } from 'vue'; import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src export default defineComponent({ name: 'Home', components: HelloWorld, }, }); </script> 2. Restart the service to see the effect Double-click IV. Conclusion This is the end of this article about You may also be interested in:
|
<<: Sqoop export map100% reduce0% stuck in various reasons and solutions
>>: HTML table tag tutorial (35): cross-column attribute COLSPAN
Table of contents 1. Differences and characterist...
The default program publishing path of tomcat7 is...
Table of contents Filters 01.What is 02. How to d...
The "nofollow" tag was proposed by Goog...
1. Complexity of front-end engineering If we are ...
Recently, WeChat was forced by Apple to develop a...
Table of contents Introduction to FTP, FTPS and S...
1. Briefly describe the traditional LRU linked li...
1. Why is eject not recommended? 1. What changes ...
Table of contents What is an index The difference...
I recently made a file system and found that ther...
Table of contents What is two-way data binding Im...
1. Stop the mysqld.exe process first 2. Open cmd ...
Table of contents React Fiber Creation 1. Before ...
In real life, a lock is a tool we use when we wan...