位置: 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 可变参数模板的妙用(泛化的理解)

  • 应交税费转出未交增值税借贷方表示什么
  • 单位的车辆车船税怎么交
  • 注册资本印花税怎么交?什么时候交?
  • 公司车辆过户给个人需要交多少税
  • 纳税人等级怎么划分
  • 开了负数发票增值税申报表怎么填
  • 税率开错情况说明
  • 网络团购的类型
  • 招待客人的场景图
  • 过路过桥费抵扣2021新规定
  • 事业单位需要写自传吗
  • 装卸费收取的税收筹划是怎样的?
  • 本期认证本期不抵扣下月再抵扣
  • 企业微信收入也要交税吗
  • 多交的增值税怎么申报
  • 证券资金利息
  • 工程建设期间的借款利息
  • 企业帐薄包括哪些
  • 没收到电费账单怎么办
  • 货物损坏补发会计分录
  • mac废纸篓立即删除和清倒
  • 苹果14出来13会下架吗
  • 如何把文档转换成二维码
  • 创业补贴的作用
  • 职工教育经费会计准则最新规定
  • 薏米红豆粥的做法视频
  • 企业收到的保险理赔款会计分录
  • 更改公司章程发函怎么写
  • 本单位生产的水泥属于
  • array php
  • 企业营运资金管理存在的问题
  • php中.的作用
  • 真题解析买谁的
  • 禁用dos命令
  • 研发的无形资产
  • 小规模自开专票办理流程
  • 财报层次和认定层次
  • 蔬菜开发票到哪里开呢?
  • 税控盘的作用是什么
  • 取得费用报销单怎么填写
  • 其他应收款科目代码
  • 资产负债表应收账款期末余额公式
  • 一般纳税人跨年冲红报年度所得税怎么做
  • 库存股属于什么账户
  • 固定资产3%减按2%征收增值税申报表如何填写
  • 加油站充值套路
  • 公司 股东 变更
  • 财务报表年报里面的利息费用怎么填
  • 劳务公司成本核算方法一般选择哪个
  • 押金 做账
  • 收到银行手续费发票怎么入账
  • 实物出资没有发票怎么办
  • 企业法人从公司怎么拿钱
  • 工程施工企业收到工程款,怎么做分录
  • 售后回租含手续费吗
  • 土地出让过程缴纳的费用
  • 进项跟销项金额一样是否可行
  • 什么计提折旧不能转回
  • mysql group_concat()函数用法总结
  • 分页存储过程包括
  • centos7搜索
  • centos下安装gcc
  • 电脑一直显示windowsxp怎么办
  • ubuntu集成开发环境
  • mac win10 wifi
  • scureapp.exe - scureapp是什么进程 有什么用
  • win7更改ip地址后有网络无法上网
  • 联想 恢复
  • js跨域8种解决方案
  • exceltype函数的用法
  • html5画布五角星
  • python中的文件读写
  • 用python编写登录程序
  • LocalBroadcastManager原理和机制
  • unity ugu
  • jquery插件是干什么的
  • jquery基础知识梳理
  • 南方电网统一供应链平台
  • 北京国家税务局待遇
  • 临沭公交车多久一班
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设