![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
文章平均质量分 60
奔跑的露西
滴水穿石
展开
-
VUE-template报错:TypeScript intellisense is disabled on template. To enable, configure `“jsx“: “prese
VUE-template报错:TypeScript intellisense is disabled on template. To enable, configure `"jsx": "prese原创 2022-08-25 11:18:11 · 593 阅读 · 0 评论 -
解决: Cannot read properties of null (reading ‘pickAlgorithm‘)
解决: Cannot read properties of null (reading 'pickAlgorithm')原创 2022-08-28 22:55:30 · 1760 阅读 · 0 评论 -
Vue--mixin混入操作(局部/全局混入)
Vue--mixin混入操作(局部/全局混入)原创 2023-02-20 12:56:18 · 2257 阅读 · 2 评论 -
解决:Refused to apply style from ‘http://localhost:8080/iconfont.css‘
解决:Refused to apply style from 'http://localhost:8080/iconfont.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.原创 2023-03-24 11:45:29 · 2083 阅读 · 2 评论 -
路由传参的几种方式
路由传参的几种方式原创 2023-03-25 11:42:35 · 3706 阅读 · 0 评论 -
解决:Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location
问题:解决vue路由传递参数时,重复点击会抛出NavigationDuplicated的警告错误。原因:vue-router引入了promise, push的时候会返回一个promise。解决方法一:给push方法直接传成功和失败的回调函数。解决方法二:在路由内重写push或replace方法。原创 2023-03-25 18:22:29 · 1958 阅读 · 2 评论 -
mock的使用
mock数据:是指通过模拟实际数据的请求和响应,来生成测试数据,从而提供给应用程序的测试、开发、联调等环节使用的一种技术。图片放置到public文件夹中【public文件夹在打包的时候,会把相应的资源原封不动打包到dist文件夹中】第六步:在统一管理api接口的index.js文件内,引入二次封装的mock请求,获取接口数据。第三步:在mock文件夹中创建mockServe.js文件,通过mockjs插件实现模拟数据。第五步:在api文件夹下新建mockIndex.js文件,用于模拟数据的axios请求。原创 2023-03-28 14:29:05 · 2702 阅读 · 0 评论 -
解决:Component name “index“ should always be multi-word
要求组件名称以驼峰格式命名,自定义组件名称应该由多单纯组成,防止和html标签冲突,所以index.vue 会报错。vue报错:Component name "index" should always be multi-word。若没有.eslintrc.js文件,也可以直接在package.json文件中添加,路径为👇。按照规则,将组件名称改为驼峰格式,如:appIndex.vue。最后:输入npm run serve重新编译,就不会出错了。原创 2023-04-18 15:53:27 · 15718 阅读 · 3 评论 -
解决:Uncaught (in promise) Error: Request failed with status code 400
第二步:去组件中查看自定义回调函数内的参数是否书写正确,检查后发现,我接收的参数没有解构就直接使用了,导致参数异常![object%20Object]--->👉可能是由于JavaScript对象未正确转换为字符串表示形式导致的。第一步:我先去检查了接口看书写是不是有问题,参数有没正常携带,检查了几遍发现接口书写的没问题。以下2张图片作为对比,上面是错误的,错误原因为:参数未解构就直接使用了。错误可能是由于请求参数不正确或者缺少必要参数导致的。在写项目的时候,获取三级联动的数据,一直报以下错误。原创 2023-04-24 10:57:27 · 7990 阅读 · 2 评论 -
Vue组件通信-$attrs与$listeners概念与应用
一、$attrs与$listeners是什么$attrs与$listeners都是是属于组件实例自身的一个属性:包含了父作用域中不包含在props中的属性,这些属性可以在组件内部使用,也可以通过v-bind="$attrs"传递给子组件使用。:包含了父作用域中的(不含.sync修饰器的)v-on事件监听器,这些监听器可以在组件内部使用,也可以通过v-on="$listeners"传递给子组件使用。原创 2023-04-25 16:24:15 · 3909 阅读 · 1 评论 -
解决:[Vue warn]: Error in render: “TypeError: Cannot read properties of undefined (reading ‘matched‘)“
出错的代码尝试访问一个叫做'matched'的属性,但是该属性所属的对象是undefined,导致抛出了TypeError异常。我是在App组件中使用了router,在main.js中引入和注册router的,检查发现在main.js中引入和注册的是。这个错误表示,App组件在渲染过程中尝试访问一个未定义的属性或方法,例如访问一个空对象的属性或调用一个未定义的函数。在main.js中引入和注册router,如下是正确写法👇。检查代码中是否有未定义变量或者空对象的情况👇。routes,并非router。原创 2023-05-03 15:28:12 · 15466 阅读 · 0 评论 -
解决:element-ui分页器在将最后一页列表数据删完时,页面不刷新到最新数据
解决:element-ui分页器在将最后一页列表数据删完时,页面不刷新到最新数据原创 2023-05-09 15:21:27 · 1081 阅读 · 0 评论 -
记录:Vue组件通信方式(包含Vue3和Vue2)
组件通信是指在不同组件之间传递数据、交互和协作的过程。通过合理的组件通信方式,我们能够实现组件之间的解耦和灵活的功能组合,提高代码的可维护性和复用性。子向父传递数据①第一步:使用了defineEmits方法,不需要引入直接使用,传递一个数组,数组元素即为将来组件需要触发的自定义事件类型,此方执行会返回一个$emit方法用于触发自定义事件。②第二步:当点击按钮的时候,事件回调内部调用$emit方法去触发自定义事件,第一个参数为触发事件类型,第二个、三个、N个参数即为传递给父组件的数据。原创 2023-06-23 13:34:44 · 286 阅读 · 0 评论 -
解决:模块 ““element-plus““ 没有导出的成员 “ElMessage“。你是想改用 “import ElMessage from “element-plus““ 吗?
使用vue3+vite+ts+Element Plus开发项目,项目运行时是正常的,但会有错误显示,如下:二、错误内容:模块 ""element-plus"" 没有导出的成员 "ElMessage"。你是想改用 "import ElMessage from "element-plus"" 吗?原创 2023-07-04 20:07:36 · 1629 阅读 · 0 评论 -
解决:vue路由守卫---“next is not a function“
beforeEach函数需要带3个参数,分别是to, from, next;原创 2023-07-05 01:09:17 · 1020 阅读 · 0 评论 -
Vue项目使用七牛云CDN存放静态资源
七牛云可以免费存储用户的静态资源( js/css/图片),我们将静态资源放在七牛云上,通过引用它们,达到不走花生壳网络,提升访问效率。原创 2023-08-01 12:46:47 · 1133 阅读 · 1 评论 -
vue3 实现登录验证码
vue3项目----实现登录验证码vue3项目前提条件:已安装引入【element-plus】,【vue-router@4】,【sass】等。原创 2023-08-22 14:45:44 · 10205 阅读 · 11 评论 -
Vue3 多语言 Vue-I18n国际化
【代码】Vue3 多语言 Vue-I18n国际化。原创 2023-08-23 00:21:05 · 2480 阅读 · 0 评论 -
Vue3 Element-plus Upload 上传图片
该组件在上传之前会触发 beforeAvatarUpload 函数,但是该函数内部的操作会导致额外的请求发送到 http://localhost:5173/,从而导致 404 错误。官网中upload组件中action是可以直接写请求 URL,因为我在请求头中添加了租户id和token,如果直接将URL写入action中会报错‘‘缺少租户id’’,所有利用axios请求URL。点击上传图片时,请求后端接口(接口为封装好的reqUpload函数),将选中的文件作为接口的参数。原创 2023-08-28 16:23:34 · 8361 阅读 · 4 评论 -
element ui 下拉框 选择月份和天数
目前做的管理系统项目,期望实现功能为:设置出账周期和出账日,考虑使用element ui下拉框实现功能。原创 2023-10-17 22:58:27 · 884 阅读 · 0 评论 -
vue2 解密图片地址(url)-使用blob文件-打开png格式图片
开发中需要对加密文件进行解码,如图片等静态资源。根据后端给到的url地址,返回的是图片文件,但是乱码的,需要解码成png图片进行展示。原创 2023-10-17 23:43:07 · 1293 阅读 · 0 评论 -
Element 多个Form表单 同时验证
在一个页面中需要实现两个Form表单,并在页面提交时需要对两个Form表单进行校验,两个表单都校验成功时才能提交。原创 2023-10-29 13:08:22 · 4160 阅读 · 3 评论 -
【Element】el-progress 自定义进度条
要求弹窗内显示进度条,根据接口获取当前进度值,间隔5秒调用接口获取最新进度值,当进度值为100时,允许关闭进度条弹窗原创 2023-11-21 19:07:40 · 2345 阅读 · 0 评论 -
【Element】el-switch开关 点击弹窗确认框时状态先改变----点击弹窗取消框失效
需求:在列表中添加定期出账的开关按钮,点击开关时,原来的状态不改变,弹出弹窗;点击弹窗取消按钮:状态不改变,点击弹窗确定按钮:状态改变,并调取列表数据刷新页面。原创 2023-11-24 10:59:17 · 1865 阅读 · 0 评论 -
【Element】el-table组件使用summary-method属性设置表格底部固定两行并动态赋值
需求:在表格账单中底部添加两行固定行,来统计当前页小计和总计。element ui 官网上是直接将本列所有数值进行求合操作的,且只有固定一行总计。目前的需求是将接口返回的数据填充到底部固定的两行中原创 2023-12-04 14:42:29 · 2381 阅读 · 0 评论 -
unpkg.com地址无法访问可替代方案
项目中使用的 wangEditor富文本,使用的地址为:https://unpkg.com,但无法访问,富文本加载不出来,一直转圈圈原创 2023-12-15 19:32:25 · 1789 阅读 · 2 评论 -
【Element】el-select下拉框实现选中图标并回显图标
需求:在下拉框中选择图标,并同时显示图标和文字,以便用户可以直观地选择所需的图标。原创 2023-12-25 17:27:15 · 2236 阅读 · 0 评论 -
解决:vue.min.js:6 TypeError: Cannot read properties of undefined (reading ‘_wrapper‘)
但实在是不知道问题出在哪里,代码一点点去排查,最后发现定义了点击事件,没有在methods中书写,我擦,找了半天,记录下这个问题,真的是不细心。问题百度了下,意思是代码中出现了一个无法读取未定义属性'_wrapper'的问题。这种错误通常发生在Vue.js实例。在输入框输入数据时,控制台直接报错,输入框中也不能显示并无法输入数据。methods中书写addCharge方法即可解决。原创 2024-01-02 20:46:34 · 1457 阅读 · 0 评论 -
【Element】el-form和el-table嵌套实现表格编辑并提交表单校验
页面需要用到表格采集用户数据,提交时进行表单校验;即表格中嵌套着表单,保存时进行表单校验。原创 2024-01-05 20:00:35 · 4989 阅读 · 7 评论