vue
文章平均质量分 50
积极的小可爱呀
我我我。。。哈哈哈傻乐呵
展开
-
SyntaxError: Unexpected token ‘<‘ (at chunk-vendors.fb93d34e.js:1:1)打包后页面白屏vue
项目本地运行一切正常,打包后发布,点开页面白屏,控制台报错原创 2024-06-27 14:05:02 · 269 阅读 · 2 评论 -
vue props引用型数据 子组件修改影响父组件 深拷贝浅拷贝问题
功能:表格中点击编辑,弹出层显示该条数据,可以编辑。原创 2022-01-13 23:30:02 · 3918 阅读 · 5 评论 -
vant list 加载列表 下拉加载数据 无痕加载
功能:滑动下拉一直加载后端接口:列表是分页的模式,需要传入page(当前页码),pagesize(每页返回数据)效果图html <van-list v-model="loading" :finished="finished" :finished-text="`查询到 ${showList.length} 条信息`" @load="getMessageListFun"> <div class="items" v-for="(item ,i ) in showLi.原创 2021-12-22 16:16:28 · 1405 阅读 · 0 评论 -
vue 使用qrcode生成二维码
npm install qrcode --save-dev在需要的界面引入import QRCode from "qrcode"; components: { QRCode }, methods:{setCode() { let ops = { text: `XXX`,//暂时没发现有啥用 width: document.body.clientWidth * 0.78,//二维码的宽 height: document.body.cli原创 2021-11-25 11:19:05 · 931 阅读 · 0 评论 -
vue cli data获取问题 外部设备调用
实现功能当页面某参数已经变化的时候,用户点击了返回(按键,框架的返回),前端拦截,询问是否确认关闭界面,用户确认再退出关闭界面。如果是使用html+vue.js这样写可以的后来使用vue cli后,最大的问题就是怎么获取到data里的hasCheckSzkw和showOut参数呢然后各种百度,有一篇是这样写的,好像很有道理然后我也这样写,发现不行,一堆报错,路由都会给我弄没,就。。。解决办法后来就看自己的代码,发现onresize都能在mounted里写,凭啥设备的全局调用方法不行。然后原创 2021-11-22 11:05:13 · 366 阅读 · 0 评论 -
vue单页面加载了所有js文件解决办法
看其他人解决办法都是我原先就是这么写的了,看控制台还是加载了所有Js。后来再某个文章里看到解决办法在vue.config.jsmodule.exports = { chainWebpack: config => { config.plugins.delete("prefetch")//只加载当前页面需要的js },}文章链接...原创 2021-11-19 15:14:28 · 2549 阅读 · 1 评论 -
vue vant Calendar组件日历 开始时间 结束时间的范围控制 时间戳标准时间转换 获得月份的最后一天
功能:开始时间范围选择: 最小时间:去年的今天 最大时间:当前时间 结束时间范围选择: 最小时间:开始时间 最大时间: 开始时间月份的最后一天比如:当前时间2021-07-24,开始时间选择范围就在:2020-07-24至2021-07-24当开始时间选择 2020-09-10 结束时间选择范围在:2020-09-10至2020-09-30思路:1:主要是设置vant中van-calendar 组件的min-date和max-date来控制选择范围2:开始时间选择范围.原创 2021-07-24 10:39:28 · 11922 阅读 · 0 评论 -
vue动态拼接img src 并加判断
需要实现的功能,当循环index为单数时显示向上图片,为双数显示向下图片<img class="icon" :src="`${$imgsrc}${i%2==0?'down':'up'}_icon.png`">其中$imgsrc是在main.js中定义的图片链接地址原创 2021-06-30 15:35:22 · 1454 阅读 · 0 评论 -
vue 数据大屏 跑马灯 滚动列表展示 滚动+暂停
需要的功能:数据自动无缝隙播放滚动,鼠标移动上去:停止滚动,鼠标移开:接着滚动框架:vue最终效果:逻辑:1:列表使用ul>li展示2:使用两个ul实现无缝衔接功能3:使用动画实现跑马灯功能4:使用mouseenter+mouseleave实现鼠标控制滚动功能代码template: <div class="title"> <span class="name">XXXXXX销售排行榜</span> .原创 2021-06-28 11:21:04 · 4352 阅读 · 4 评论 -
swiper ie11 “TypeError: 对象不支持“isNaN”属性或方法“
前提:项目是使用Vue框架的swiper在谷歌火狐上面都是正常显示的,就只有在Ie下图片没有滚动打开控制台发现报错"TypeError: 对象不支持“isNaN”属性或方法"网上都是说使用下面的代码替换isNaNif (typeof(obj) === 'number' && isNaN(obj)) { console.log("Number NaN") }但是总不可能去改swiper的源代码吧,于是就想到了babel,因为Number.isNaN()是原创 2021-06-19 11:40:12 · 1001 阅读 · 0 评论 -
vue 动态class绑定 基础class加接口动态变化的class
<span :class="['type', `type_${item.type}`]">{{item.typaName}}</span>出现情况,需要for循环出多个span,该span有一个基础的class样式“type”,另一个样式"type_接口数据"最后展示出来的span类似于:教学赛事...原创 2021-06-18 08:52:45 · 204 阅读 · 0 评论 -
PostCSS plugin postcss-pxtorem requires PostCSS 8. Migration guide for end-users:移动端配置rem适配,vant样式问题
环境状况:移动端,vue,vant<使用了lib-flexible不用vant的一些样式的话,其实没啥问题的,直到在苹果上发现弹出框特别小,而且输入框也特别小。我就感觉肯定有些配置原因。查找各种资料之后,终于找到了原因。原因:1配置了lib-flexible后,代表所有单位都是rem,但是vant的单位是px,导致样式问题。解决:1,参考vant官方文档里面说的1:参考这篇文章:链接,下载postcss-pxtorem依赖,并配置postcss.config.js这个后就报错2:后面再去参原创 2021-05-24 17:43:55 · 3247 阅读 · 1 评论 -
We‘re sorry but XXX doesn‘t work properly without JavaScript enabled. Please enable it to contin
需要的功能:引入公共的css文件确定路径没有写错!!!并且相对路径绝对路径都尝试过!!!(其中“vue项目测试”是我在vue.config.js中修改的项目名称)出现这个问题是我在index.html中使用link标签导入的外部css文件,导入失败,这个css并没有效果解决办法:在main.js中使用import导入这个css ,就没有报错,并且css有正确引入了还有一种办法是在app.vue中引入<style lang="less> @import '../src/as原创 2021-05-10 14:47:30 · 6040 阅读 · 0 评论 -
vant 按需引入Object(...) is not a function报错
我一直检查没发现我引入vant的方式有问题啊,跟着官方文档走。在main.js里面然后运行就一直报错并且页面一直空白,然后疯狂找资料。。。最后发现是我vue 的版本是2,然后我是使用vue3的方式引入的vant…知道原因后重新下载vant在package.json文件中查看重新安装后的vant版本,都是2后重新启动就正确了。重点:...原创 2021-03-11 15:30:20 · 2682 阅读 · 2 评论 -
elemnetUi+vue+html多文件上传,匹配对应文件描述,删除待上传文件及其中的一些细节
前提这个模块功能是作为一个插件使用在某系统上的,所以没有搭建vue cli来写。使用到的是vue,js+element.js+element.css+jq.js+ajax。<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"><script src="https://unpkg.com/element-ui/lib/index.js"></script>原创 2021-01-12 12:00:05 · 370 阅读 · 0 评论 -
Invalid component name: “#khps“. Component names should conform to valid custom element name in html
刚开始百度查看都是说在compontent注册组件时少写{},但是我出现问题的界面没有使用别的组件呀!然后我对比其他没有报错的界面,最后就发现了定义name的时候,应该写khps,而不是**#khps**也是自己粗心,记录下...原创 2021-01-12 09:45:54 · 2790 阅读 · 1 评论 -
vue配置模拟axios后台请求,使用自定义axios的json文件,自定义后台数据
1:在static文件夹下新建一个mock(自定义名字)文件夹,将自己写的json文件放入.注意是看清是哪个个static文件。json文件:{ "ret": true,//设置这个是要判断,下面代码会用到 "data": { "city":"泉州" } }2:首先要先下载axioscnpm install axios --save3:在想要使用的界...原创 2020-02-24 21:59:18 · 536 阅读 · 1 评论