平江网站设计多少钱,wordpress改 cms,创新的常州网站建设,三网合一网站建设系统 价格#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是否安装好
文章末尾
