位置: IT常识 - 正文

Vue3的main.js的坑(vue3.0 main.js)

编辑:rootadmin
Vue2升级为Vue3之后有很多新内容,但也有很多坑,这里讲下我今天刚学Vue3遇到的坑。可以直接到最后看main.js。 首先就是Element-ui,前端vue一般都使用这个插件,但这个插件在Vue3中就不能用了(应该是暂时,目前2022年4月10日),but它有一个兄弟可以用,它叫elemen ...

推荐整理分享Vue3的main.js的坑(vue3.0 main.js),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:vue main.ts,vue main.js app.vue,vue3.0 main.js,vue main.js app.vue,vue main.js app.vue,vue项目中main.js作用,vue项目中main.js作用,vue项目中main.js作用,内容如对您有帮助,希望把文章链接给更多的朋友!

Vue2升级为Vue3之后有很多新内容,但也有很多坑,这里讲下我今天刚学Vue3遇到的坑。可以直接到最后看main.js。

首先就是Element-ui,前端vue一般都使用这个插件,但这个插件在Vue3中就不能用了(应该是暂时,目前2022年4月10日),but它有一个兄弟可以用,它叫element-plus,安装方法也和之前一样。

npm ielement-plus

引入的css也不一样,变成了import 'element-plus/dist/index.css' 这个。

Vue3的main.js的坑(vue3.0 main.js)

非常重要的axios也不一样,需要安装axios和vue-axios。

npm i axios

npm i vue-axios

路由也不一样,虽然也需要安装vue-router,但不用在main.js里写出来,router文件夹下的index.js的内容也不一样,这里的代码借鉴了CSDN里小满zx的代码。

npm ivue-router

import { createRouter, createWebHistory, createWebHashHistory, createMemoryHistory, RouteRecordRaw } from 'vue-router'//vue2 mode history vue3 createWebHistory//vue2 mode hash vue3 createWebHashHistory//vue2 mode abstact vue3 createMemoryHistory//路由数组的类型 RouteRecordRaw// 定义一些路由// 每个路由都需要映射到一个组件。const routes = [{ path: '/', component: () => import('../components/Login.vue')},{ path: '/home', component: () => import('../components/Home.vue')}]const router = createRouter({ history: createWebHistory(), routes})//导出routerexport default router

需要注意的是,这里的页面需要放到组件中,也就是.vue文件需要放在components文件夹下,类似那个helloworld页面。

main.js文件里的引入方式和vue2的差不多,但最后use的部分需要注意,可以像我最下面main.js里的代码直接连在一起写,也可以:

const app = createApp(App)app.use(router)......app.mount('#app')

最后附上main.js的样例代码:

import { createApp } from 'vue'import App from './App.vue'import ElementPlus from 'element-plus'import 'element-plus/dist/index.css' import axios from 'axios'import VueAxios from 'vue-axios'import router from './router'createApp(App).use(router).use(ElementPlus).use(VueAxios,axios).mount('#app')

以上就是我暂时遇到的坑,有问题可以评论或者私信b站的 景苒酱

本文链接地址:https://www.jiuchutong.com/zhishi/304548.html 转载请保留说明!

上一篇:聊聊Discuz怎么修改帖子标题的字符长度限制(discuz论坛账号)

下一篇:泛化之美 —— C++11 可变参数模板的妙用(泛化的理解)

  • 小米平板5怎么设置农历(小米平板5怎么分屏)

    小米平板5怎么设置农历(小米平板5怎么分屏)

  • 苹果手表门禁卡功能怎么用(苹果手表门禁卡nfc功能怎么用)

    苹果手表门禁卡功能怎么用(苹果手表门禁卡nfc功能怎么用)

  • 小爱同学灵敏度怎么设置(小爱同学灵敏度不高)

    小爱同学灵敏度怎么设置(小爱同学灵敏度不高)

  • 抖音互赞会不会有影响呢(抖音互赞会影响流量吗)

    抖音互赞会不会有影响呢(抖音互赞会影响流量吗)

  • 中转站剩余容量不足(中转站剩余空间不足怎么办)

    中转站剩余容量不足(中转站剩余空间不足怎么办)

  • airpods pro充电指示灯不亮(airpodspro充电指示灯不亮)

    airpods pro充电指示灯不亮(airpodspro充电指示灯不亮)

  • 12306购票记录保存多久(12306历史订单保存多久)

    12306购票记录保存多久(12306历史订单保存多久)

  • 抖音总公司在哪里(抖音总公司在哪个地方)

    抖音总公司在哪里(抖音总公司在哪个地方)

  • 小米手环一直提示请先绑定(小米手环一直提醒短信正在运行)

    小米手环一直提示请先绑定(小米手环一直提醒短信正在运行)

  • 注销的淘宝号还能找回吗(注销的淘宝号还在怎么回事)

    注销的淘宝号还能找回吗(注销的淘宝号还在怎么回事)

  • rtu和dtu区别(rtu定义)

    rtu和dtu区别(rtu定义)

  • 微信的违规交易指的是什么(微信违规交易被限制领取红包)

    微信的违规交易指的是什么(微信违规交易被限制领取红包)

  • 鼠标卡顿是怎么回事(鼠标卡顿怎么解决)

    鼠标卡顿是怎么回事(鼠标卡顿怎么解决)

  • qq等级怎么快速升高(qq等级怎么快速升皇冠)

    qq等级怎么快速升高(qq等级怎么快速升皇冠)

  • 苹果手机照片删不掉怎么回事(苹果手机照片删除了怎么恢复)

    苹果手机照片删不掉怎么回事(苹果手机照片删除了怎么恢复)

  • 蜂窝数据是什么(苹果的蜂窝数据是什么)

    蜂窝数据是什么(苹果的蜂窝数据是什么)

  • 全栈开发什么意思(全栈开发需要具备什么能力)

    全栈开发什么意思(全栈开发需要具备什么能力)

  • word怎么把图片变成圆角(word怎么把图片放到想要的位置)

    word怎么把图片变成圆角(word怎么把图片放到想要的位置)

  • xp系统任务栏太宽

    xp系统任务栏太宽

  • 小米9pro手机耗电快怎么解决(小米9pro耗电太快)

    小米9pro手机耗电快怎么解决(小米9pro耗电太快)

  • iphone11怎么设置24小时制(iphone11怎么设置24小时)

    iphone11怎么设置24小时制(iphone11怎么设置24小时)

  • 立刷怎么注销个人信息(立刷pos机怎么注销)

    立刷怎么注销个人信息(立刷pos机怎么注销)

  • 手机视频存在哪里(手机视频存在哪里不会丢失)

    手机视频存在哪里(手机视频存在哪里不会丢失)

  • iqoo液冷散热怎么打开(vivoiqoo液冷散热)

    iqoo液冷散热怎么打开(vivoiqoo液冷散热)

  • 小米手机的通话设置在哪里(小米手机的通话记录不见了)

    小米手机的通话设置在哪里(小米手机的通话记录不见了)

  • 网易考拉怎么退货(网易考拉退款要多久)

    网易考拉怎么退货(网易考拉退款要多久)

  • Win10 Build 21354 太阳谷ISO镜像版体验报告 含下载地址

    Win10 Build 21354 太阳谷ISO镜像版体验报告 含下载地址

  • 苹果推送OSX10.11.6正式版/macOS Sierra开发者预览版Beta3固件更新(苹果推送改不掉三全音)

    苹果推送OSX10.11.6正式版/macOS Sierra开发者预览版Beta3固件更新(苹果推送改不掉三全音)

  • 税务机关如何处理公司多交税
  • 计提城市维护建设费和教育费附加的会计分录
  • 公积金贷款金额少怎么办
  • 应收账款平均余额公式
  • 差旅费津贴需要缴纳个人所得税吗?
  • 税务逾期记录怎么消除不了
  • 8000块电脑大概能跑多少分
  • 固定资产怎么进账
  • 申请开红字发票,原蓝字发票要退回来吗
  • 个人生产经营所得税税率表
  • 公司清算往来科目应该怎么处理?
  • 公司借别的公司的钱再借给别的公司
  • 小型微利企业免于填报
  • 可以把两张发票合写在记账凭证上吗
  • 半年报利润分配是否需要审计?
  • 土地出让金产生的利息交契税吗
  • 工程预缴增值税2019最新规定
  • 其他权益工具投资公允价值变动怎么计算
  • 出租人负责维修
  • 财务新手要注意哪些事项
  • 税控机动车销售统一发票抵扣
  • 代垫运费增值税怎么算
  • 前端后端选择
  • 公司偷税漏税有哪些表现形式
  • yolov3训练自己的数据超详细
  • 生产型企业出口退税计算案例
  • 购入电脑可以入成本里吗
  • 浅谈php中变量的使用情况
  • vue常用
  • php zmq
  • 帝国cms app
  • vue挂载dom
  • 应交税费转出会计分录
  • 固定资产折旧应计入什么费用
  • 销货退回与折让属于什么科目
  • 暂估入库成本处理
  • 织梦自定义字段
  • sql server基本知识
  • 职工薪酬包括哪几类
  • 培训机构财务怎么做账
  • 进项税额已经抵扣是什么意思
  • 预付账款怎么记账
  • 土地增值税要计入税金及附加吗
  • 企业固定资产可以不提折旧吗
  • 财务会计应收票据
  • 暂估入库估多了,汇算清缴前调整
  • 公允价值变动损益和投资收益区别
  • 投资别人的公司叫什么
  • 填制会计凭证要求的是
  • mysql中分组
  • b-树和b+树都能有效地支持随机检索
  • sql server服务器模式
  • sql作业怎么执行
  • centosyum源
  • sql时间格式化大全
  • MySQL数据迁移到oracle
  • ubuntu 无线wifi
  • win8 start menu
  • win10系统任务栏卡顿
  • xp系统鼠标右键无法弹出菜单
  • linux抓包语句
  • 如何删除win8系统
  • Win10预览版镜像
  • 用linux配置ftp服务器的过程
  • Extjs中使用extend(js继承) 的代码
  • Extjs4 Treegrid 使用心得分享(经验篇)
  • 用jquery制作网页
  • android开发mvc mvp mvvm
  • 安卓十游戏怎么玩
  • 深入理解linux系统
  • python win32print
  • Activity的四种启动模式和onNewIntent()
  • python整理表格不用入门
  • jquery上滑下滑
  • npm yarn命令对比
  • javascript判断浏览器
  • python批量填表
  • 地税申报网站
  • 社保工资申报错了可以重新申请吗
  • 期房交了契税就可以拿房产证了吗
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设