专业刷粉网站,网站建设教程网站,赣州网站建设江西网站建设,体育网站建设的分析#x1f4d1;前言 本文主要是【Vue】——Vue基本使用的文章#xff0c;如果有什么需要改进的地方还请大佬指出⛺️ #x1f3ac;作者简介#xff1a;大家好#xff0c;我是听风与他#x1f947; ☁️博客首页#xff1a;CSDN主页听风与他 #x1f304;每日一句#x…前言 本文主要是【Vue】——Vue基本使用的文章如果有什么需要改进的地方还请大佬指出⛺️ 作者简介大家好我是听风与他 ☁️博客首页CSDN主页听风与他 每日一句狠狠沉淀顶峰相见 目录 前言安装vue-router路由配置安装element-ui包管理:按需打包margin的用法创建表单对象安装图标库安装axios文章末尾 安装vue-router路由配置 npm vue-router在router目录下的index.js下将router暴露出去 export default router在main.js配置下挂载router const app createApp(App) app.use(router) app.mount(#app)App.vue下要写下路由 div router-view/router-view /divmain.js文件 安装element-ui包管理: npm install element-plus --save按需打包 npm install -D unplugin-vue-components unplugin-auto-import按需引入到vite.config.js中 import { defineConfig } from vite import AutoImport from unplugin-auto-import/vite import Components from unplugin-vue-components/vite import { ElementPlusResolver } from unplugin-vue-components/resolversexport default defineConfig({// ...plugins: [// ...AutoImport({resolvers: [ElementPlusResolver()],}),Components({resolvers: [ElementPlusResolver()],}),], })margin的用法 margin后面四个参数按顺序包含margin-top,margin-right,margin-bottom,margin-left,它们是透明不可见的。 vue中script中的setup参数解释:setup是vue3新增加的组件vue3采用组合式API为了方便使用组合式API我们需要一个入口在vue3组件中称为setup。 创建表单对象 注意引入reactive对象 import {reactive} from vue; const form reactive({username:,password:,remember:false })表单的使用,插入图标 el-form v-modelformel-form-itemel-input v-modelform.username maxlength10 typetext placeholder用户名/邮箱template #prefixel-iconel-iconUser //el-icon/el-icon/template/el-input/el-form-item/el-form安装图标库 npm install element-plus/icons-vue安装axios npm install axios可以在package-lock里面查看axios是否安装好 文章末尾