- 博客(49)
- 收藏
- 关注
RSS订阅原创 JSON 格式循环引用报错
是一个在 JavaScript 中常见的错误，通常发生在尝试使用 JSON.stringify() 方法将包含循环引用的对象转换为 JSON 字符串时。循环引用指的是一个对象通过其属性间接或直接地引用了自己，形成了一个闭环。由于 JSON 格式本身不支持循环引用，因此在尝试将这样的对象转换为 JSON 时会抛出此错误。
2025-01-08 10:17:52
379
原创 scss的&-
3.使代码简洁，不要写大量重复的逻辑代码（公共方法需封装，公共样式提取到公共样式中）2.Html的 规范：普通标签使用小写，外部引入的组件标签使用大写。1.代码scss样式多层嵌套的问题。& 用在嵌套代码里，来引用父元素。
2023-09-12 14:34:14
361
原创 swiper组件点击事件失效的问题
当swiper设置loop=true时，会生成虚拟slide进行填充，对这些虚拟slide元素进行操作无效；**问题：**当我直接在swiper组件里的div上放@click事件时，点击事件偶尔会失效；将点击事件以下代码放进swiperOption里。
2023-08-16 14:42:45
2343
原创 vue3的学习【超详细】
在Vue2中，数据响应式主要借助Object.defineProperty()来实现，存在的缺陷是无法操作数据的增加和删除，在Vue3中，数据响应式主要借助proxy和Reffect配合实现，可以做到实现数据的增删改查。指令系统是计算机硬件的语言系统，也叫机器语言，它是系统程序员看到的计算机的主要属性。因此指令系统表征了计算机的基本功能决定了机器所要求的能力在vue中提供了一套为数据驱动视图更为方便的操作，这些操作被称为指令系统。
2023-05-18 17:24:16
10620
1
原创 时间轴的样式
二.6.23左边的数字包括轴线的颜色都是橘色。三.6.23右边的数字包括轴线的颜色是灰色。例如：后台给的时间是6.23。一.6.23那天是红色的。
2023-04-10 11:43:59
269
原创 swiper组件做下滑翻页时遇到超长白屏的问题
解决方法如下图：给swiper组件每一级固定一样的高度就好了/deep/.swiper-container { width: 100%; margin-left: auto; margin-right: auto; height: remit(1550) !important; .swiper-wrapper { width: 100%; height: remit(1550) !important; .swiper-slide { overflo
2022-05-05 16:59:51
683
原创 vue列表固定左边两列
1.这是头部列表 <li class="header-item seqq" :class="searchLeftFixed==true?'isLeftFixed1':''">序号(id)</li> <li class="header-item xiao" :class="searchLeftFixed==true?'isLeftFixed2':''">挑战类型</li> <li class="header-item kongbai" v-if=
2022-05-05 16:43:22
1259
原创 解决vue两个视频切换时正在加载中的白屏现象
<div class="videoWrap-after" v-if="twoShow"> <video-player class="video-player vjs-custom-skin" ref="videoPlayerAfter" :playsinline="true" :options="playerOptionsTwo" @ended="onPlayerEnde..
2022-05-05 11:16:47
1314
原创 监听页面的关闭和打开
这个是针对音乐的播放与暂停，当页面开启时，自动播放音乐，当页面退出时，自动关闭音乐<!-- 音乐播放 --> <audio :src="require('../../audio/new.mp3')" preload="auto" loop id="audio" ></audio> <div @click="changeOn" :class="isOff == tru
2022-04-14 11:43:08
890
原创 监听页面滚动距离并固定导航栏，且导航栏随页面横向滚动而滚动
1.监听页面滚动距离mounted() { window.addEventListener("scroll", this.handleScroll,true) },2.固定导航栏，且导航栏随页面横向滚动而滚动 methods: { handleScroll (e) { let scrollY = e.target.scrollTop; //获取导航来距离顶部距离 这个方法管用 let scrollX = e.target.
2022-04-13 16:04:05
1060
原创 返回旧页面要重新拿取数据
async created(){ console.log('页面开启1') document.addEventListener("visibilitychange", async() => { console.log('页面开启2') this.taskData()//每日展示信息 this.taskDate()//日期列表 }); }首次进页面只会触发页面开启1，当从其它页面返回时就会触发页面开启2，这时
2022-04-13 15:57:30
161
原创 判断长按图片
<div class="datu" v-if="picShow" @click="closePic"> <img @touchstart="Loop_Add()" @touchend="clearLoop()" :src="getDayTaskInfo.wallpaper_info.url" data-ac-shareimage="yes"
2022-04-13 15:53:41
165
原创 package.json ^ 和 ~区别
1.^插入符号^1.2.3：则表示可以是1.2.4，1.3.5， …但是不能是2.x.x2.~波浪符号~3.4：代表指定了主版本号和次版本号，也就是说可以是3.4.5， 3.4.6，… 但是不能是3.5.x
2022-04-13 15:45:23
270
原创 vue-awesome-swiper轮播插件的使用
//直接安装版本3即可，自动会选择3.1.3版本npm i vue-awesome-swiper@3 -S//或者手动指定npm i vue-awesome-swiper@3.1.3 -S//全局引入，在vue-page-base.jsimport VueAwesomeSwiper from 'vue-awesome-swiper';import 'swiper/dist/css/swiper.css';Vue.use(VueAwesomeSwiper);//局部引入import {
2022-03-10 14:26:41
1431
原创 vue里播放mp4视频路径报错
路径一直报错，原来本地视频要加上requiresources: [{ type: "video/mp4", src: require('../../video/A7.mp4')//url地址 }],
2022-02-25 15:08:57
3454
原创 vue播放MP4视频报错Module parse failed: Unexpected character ‘ ‘
引用vue-video-player插件播放本地mp4视频，一直报错：Error in data(): “Error: Module parse failed: Unexpected character ’ ’You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/con
2022-02-25 15:06:55
6249
原创 css流光动效
<div class="box"> <div class="outContainer"> <span></span> <span></span> <span></span> <span></sp...
2022-01-11 10:15:22
1181
原创 根据图片取其背景色
npm i --save colorthief //引入colorthief插件在iview的Upload上传图片的控件中，当上传成功后，自动吸取图片的主色当做图片的背景色,总结了以下四种方法，第四种是利用colorthief插件，第一种，第二种，第三种是利用的图片取主色原理，至于从rgb转为hsv，在计算是为了提高取出的背景色的饱和度和明亮度，大家可酌情自己进行更改，我最后输出的色值是16进制的。如图：<template> <div class="wrap" :styl
2021-12-13 16:36:43
2022
原创 返回值是Promise {＜pending＞}如何处理
//判断是否超过限定份数和奖励发送是否错误 async numJudgment(formData){ let uploadData={ type :formData.award_type, count :formData.award_send_info_11 || formData.award_send_info_23 }
2021-11-16 16:52:13
5235
原创 js判断哪行数据为空
for (let i = 0; i < this.treasureList.conf.length; i++) { let { gift_id, gift_name, gift_price, rate } = this.treasureList.conf[i] if (!gift_id || !gift_name || !gift_price || !rate) { this.$Message.e.
2021-09-27 11:42:37
290
原创 js时间戳与标准时间的相互转换
//时间戳转为标准时间new Date(row.create_time * 1000).format( "yyyy-MM-dd hh:mm:ss" )//标准时间转换为时间戳this.execute_time = parseInt(Date.parse(this.execute_time) / 1000)...
2021-09-27 11:36:21
1784
原创 判断某行数据为空的方法
for (let i = 0; i < this.treasureList.conf.length; i++) { let { gift_id, gift_name, gift_price, rate } = this.treasureList.conf[i] if (!gift_id || !gift_name || !gift_price || !rate) { this.$Message.e.
2021-09-24 17:04:44
85
原创 给数组增加新的属性
let target = { gift_name: '', gift_price: '', }this.data.forEach((item, idx) => { item= Object.assign({}, item, target); })
2021-09-24 17:03:17
244
原创 a,b两个数组进行对比，取出b数组中和a数组相同的部分
a.forEach((a, b) => { let arr = Object.values(b)//把对象转换成数组 let res = arr.filter((c, d) => { return a.gift_id == c.gift_id }) ...
2021-09-24 17:00:01
532
原创 如何删除数组中的属性
let arr=JSON.parse(JSON.stringify(event.conf)) arr.forEach((e)=>{ delete e.gift_name delete e.gift_price })
2021-09-24 16:51:57
325
原创 Sortable拖拽排序
1…先引入组件 import Sortable from 'sortablejs';2.点击事件<Button type="primary" class="ctrl-btn" @click="taskSorting">任务类型排序</Button>3.弹出框<Modal v-model="sortshow" draggable scrollable
2021-09-01 11:13:03
1171
原创 iview的Modal组件
Modal组件为了可以自定义按钮名称和避免错误时也会自动关闭Modal组件，我们一般自定义页脚 <div style="text-align: right" slot="footer"> <Button type="error" @click="remove" style="margin-top: 8px" >取消</Button >
2021-08-25 15:03:15
1224
原创 iview的分页组件的使用
正常使用 <Page :total="total" show-elevator show-total :page-size="pageSize" :current.sync="currentPage" @on-change="pagesizeChange"
2021-08-25 14:56:34
845
原创 iview的表格组件显示标签
使用render { title: '标签', key: 'tags', align: 'center', render: (h, params) => { let arr = (params.row.tags || "").split("\n")
2021-08-25 14:50:23
388
原创 iview的Table表格组件显示图片
使用render { title: '背景封面', key: 'sub_cover_url', type: 'image', align: 'center', render: (h, params) => { return h('img', {
2021-08-25 14:49:09
672
原创 解决iview 的select下拉框选项错位的问题
当组件在一屏内不会有什么问题，但是当弹出框超过一屏需要滚动时，select的下拉选项会出现错位，不在selcet组件上下，因为.ivu-select-dropdown自带的有 position:absolute的样式，所以我给它的上一级设置position: relative;在给他设置top:40px ；使弹出框固定在select组件的位置，不过有一个小问题，就是弹窗的展开方向被固定住了。/deep/.ivu-select{ position: relative; ...
2021-08-20 15:53:57
1345
1
原创 weex和vue
Weex是一个可以使用现代化的 Web 技术开发高性能原生应用的框架，支持原生和vue并写，原生渲染，但是组件库不完善，仅支持编写app。react和vue都是web端框架，运行在浏览器的vue是使用webview的方式渲染，性能可能有些差距。...
2021-07-30 14:52:13
271
原创 view使用Modal时出现闪关
当出现错误情况的时候本来要弹出这个弹窗，结果一闪而过，后面加上了定时器就没有问题了 let timer=null clearTimeout(timer) timer=setTimeout(()=>{ this.$Modal.warning({ 'title': '遇到了问题', 'content': res.data instanceof Array ? res.data.join('<br/&
2021-07-29 16:10:59
1168
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人