- 博客(43)
- 收藏
- 关注
原创 react memo判断刷新机制 自定义的比较函数 避免重复渲染
导致后续当我更新currentWeekNumber的值的时候发现CourseListELement组件根本更新不了(因为后续我触发给swiper参数current的值就是初始值) 明明自定义的比较函数arePropsEqual 一直在返回false 通知CourseListELement组件重新渲染 调试才发现swiper的参数从一开始初始化后一直没有更新。一开始实现了我上面指定的问题需要的函数,后面发现怎么都刷新不了,
2023-09-09 14:31:44
679
1
原创 NextJS设置Tailwind CSS
打开 tailwind.config.js 文件并根据项目需要自定义 Tailwind CSS。要在您的 Next.js 项目中使用 Tailwind CSS 样式,请将样式导入到您的 pages/_app.js 文件中。此配置设置 Tailwind CSS,添加必要的 PostCSS 插件,并包括 PurgeCSS 以删除生产构建中未使用的 CSS。这会导入已编译的 Tailwind CSS 样式并将它们应用于您的整个应用程序。这将在项目的根目录中创建一个 tailwind.config.js 文件。
2023-07-04 16:50:03
886
原创 antd 组件css的浏览器兼容性解决方案
最近写了几个后台管理,用的antd5最新版。开始都一切正常,直到测试提到360浏览器的样式有问题。才发现antd5的样式全部添加了css新语法,360浏览器完全不认识。详情请戳:https://ant.design/docs/react/compatible-style-cn以上是用where的兼容解决情况。
2023-05-23 17:16:22
2340
3
原创 vscode格式化配置
④ 复制下面代码修改配置文件 setting.json (注意下面是个人所有的vs code配置)目标任务: 基于vscode配置格式化工具,提高开发效率。② 按下Ctrl+Shift+P,查找settings。2.修改配置文件 setting.json。③点击右上角【打开设置】图标。vscode格式化配置。
2023-04-14 15:03:29
5341
原创 gojs v2.3.5去水印
在node_modules/gojs/release/go-module.js里搜索String.fromCharCode(a.charCodeAt(g)^b[(b[c]+b[d])%256]);
2023-04-11 12:01:05
721
转载 pointer-event属性详解 元素穿透点击
元素穿透点果设置了pointer-event:none 并不意味着父元素上的事件侦听器永远不会被触发,当子元素上设置pointer-event值不是none,那么都可以通过事件传播机制来触发父元素上的事件。3、 当很多元素需要定位在一个地图层上面,需用到绝对定位、相对定位的元素,这样的话,这些元素就会盖住下面的地图层,元素不会成为鼠标事件的target。了,可以再给需要操作的元素区域设置为 pointer-events:auto。一、pointer-event属性可以指定在什么情况下元素可以成为鼠标事件。
2023-01-11 17:02:22
1145
原创 http请求被307到https
一个网址既可以用http又可以用https,如果访问了一次https,重复访问时浏览器会搜索缓存是否有https网址;如果有会被默认307(临时重定向)至https,我们想让https跳回访问http需要做跨域处理, 例如这种 用户 -> https -> nginx -> http -> 服务器。那就是你曾经访问过该网址的 https 链接(当然可以通过清除浏览器历史记录来骗过浏览器,但你的用户可能不知道这个操作)一切能通过 https 访问的网址,都用 https 来访问。
2022-10-24 14:16:27
3252
原创 antd4.x版本 react DatePicker 日期选择框 自定义按钮弹出日期弹窗
自定义按钮弹出日期弹窗 react DatePicker 日期选择框
2022-09-02 15:20:57
2289
2
原创 Mapbox1.x transform:scale 缩放坐标偏移bug修复方案
以上的canvas元素如果进行缩小那rect.left和el.clientLeft中间会有空出空白空间没法计算得到的point坐标是错误的。把point变成鼠标指针相对于目标节点内边位置的X和Y坐标。修复mapbox地图源码-计算事件坐标添加位置的函数。一张图描述以上代码返回的坐标计算。用Unfull进行反缩放。用iframe进行嵌入。......
2022-07-18 15:08:23
2311
3
原创 JavaScript业务代码---连续按Enter按钮,聚焦下一个input
连续按Enter按钮,聚焦下一个input // input键盘事件 moveCursor(ev, col, row) { // console.log(this.cardInfo ,"this.cardInfoooooo=============") console.log(this.consumeTable,col,row ,'键盘事件') let Newindex = row * 19 + col; //计算是要选中哪个input,通过inputAl
2022-03-29 10:46:58
1175
原创 electron 缩略图实现
用到了nativeImage引用import { nativeImage} from 'electron' const imagebuff = nativeImage.createFromPath(path) //等比缩放到特定大小 let sizeContent = imagebuff.getSize() let calibration = sizeContent.width > sizeContent.height ? 'width' : 'height' const
2022-01-10 17:11:25
956
原创 缩略图前端electron正常版本,(图片处理库sharp,同步缩小处理)
import fs from 'fs';import Promise from 'bluebird';import sharp from 'sharp';Promise.promisify(fs.readFile)('./a.png') .then(buffer => { sharp(buffer) .resize(100, 100,{ fit: 'inside' }) .toFile('output.webp', (err,
2022-01-06 17:45:41
542
原创 # node、imagemin实现缩略图的过程
安装库import imagemin from "imagemin";import bluebird from "bluebird";import imageminMozjpeg from "imagemin-mozjpeg";import imageminPngquant from "imagemin-pngquant";//版本"imagemin": "^7.0.1","imagemin-mozjpeg": "^8.0.0","imagemin-pngquant": "^6.0.1",
2022-01-05 18:37:26
1284
原创 记录一次a标签<a>+this.$router.push(‘‘)跳转2次的bug
//bug代码<a :data-category1Id="item.categoryId" href="#" @click="jumpEvents">{{ item.categoryName }}</a>this.$router.push(localtions)会出现跳转2次的情况//第一次http://localhost:8080/#/search?category3id=165&categoryName=LED%E7%81%AF//第二次http://
2021-12-16 14:52:04
933
原创 请求api加载进度条插件 nprogress的使用
关于请求api加载进度条插件 nprogress的使用// 使用地方:在路由拦截器使用npm i --save nprogress//导入模块import nprogress from 'nprogress'//导入样式import 'nprogress/nprogress.css'//插件使用方法nprogress.start();nprogress.done();效果图...
2021-12-15 11:13:43
871
原创 axios 二次封装
import axios from ‘axios’axios.defaults.baseURL = ‘https://cnodejs.org/api/v1’axios.defaults.timeout = 10000axios.defaults.headers.post[‘Content-Type’] = ‘application/json;charset=UTF-8’// 请求拦截器axios.interceptors.request.use((config) => {return co
2021-12-14 17:44:17
1134
原创 vue2.0 关闭eslint
根目录创建vue.config.jsmodule.exports = { lintOnSave: false}
2021-12-09 12:06:27
2682
2
原创 vue的$parent $refs 和 $attrs $listener
vue的$parent $refs 和 $attrs $listener$parent :获取父对象的实例$refs:获取子组件的数据以及方法$attrs:获取父组件的传的数据 prop接收$listener:获取父组件的事件监听器
2021-12-02 16:48:25
467
原创 vue关于滚动事件 v-on:scroll
vue关于滚动页面全局监听滚动created() {var _this = this; window.addEventListener('scroll',()=>{//触发事件},true);}局部监听<!--添加ref--><div class="headcol" ref="viewBox"> <table> <thead> <tr >
2021-12-01 18:36:27
805
原创 css深度作用选择器 (修改element样式)
css深度作用选择器 (修改element样式)有效 ::v-deep 案例:.rightEdgeImage { margin: 0 20px; ::v-deep .el-image__inner { max-width: 100%; max-height: 100%; width: auto; height: auto; }}其他方案这是 vue-loader 提供的一种写法,如果你希望 scoped 样式中的一个选择器能够作用得“更深”,例如影响
2021-11-26 10:14:48
615
原创 关于调用组件里的元素 $listeners
关于调用组件里的元素调用根组件 直接在添加.native<base-input v-on:focus.native="onFocus"></base-input>调用组件里的特定元素:// 子组件Vue.component('component-input',{ template: ` <div><span>你好</span><input type="text" v-on="memefoc
2021-11-25 11:42:46
552
原创 关于javascript简单的防抖代码
关于javascript简单的防抖代码data(){ return{ vrII: "", vrIIisative: true, }}() => { if(this.vrII) clearTimeout(this.vrII); if(this.vrIIisative) { //被防抖的代码 this.$message.warning("这是最后一张"); } this.vrII = setTimeout(() => { tha
2021-11-24 11:40:04
601
原创 vue Normalize.css的使用
添加日期时间%DATE% %TIME%npm run normalize.css// 在main.js中引用import 'normalize.css/normalize.css' // A modern alternative to CSS resets作用:Normalize.css只是一个很小的css文件,但它在默认的HTML元素样式上提供了跨浏览器的高度一致性。相比于传统的css reset,Normalize.css是一种现代的,为HTML5准备的优质替代方案。Normaliz
2021-10-20 10:50:38
382
原创 vue项目 watch之 $route
添加日期时间%DATE% %TIME%// A:代码 $route: { handler: function(route) { this.redirect = route.query && route.query.redirect console.log("redirect",this.redirect) }, immediate: true }// B:代码this.$router.push({
2021-10-20 10:49:51
2321
原创 js+electron代码混淆 asarmor的应用
npm i asarmor 下载混淆插件在package文件build里添加"afterPack": “./myAfterPackHook.js”编写myAfterPackHook.js文件myAfterPackHook.js 文件const { Asarmor, Trashify } = require('asarmor');const { join } = require("path");exports.default = async ({ appOutDir, packager })
2021-10-11 10:07:27
1622
1
原创 关于高逼格VUE导入import from的来源 省略后缀与加载文件夹
查看Vue-Element-Admin的源码,其中有个Layout.vue:里面调用import导入了3个组件:import { Navbar, Sidebar, AppMain } from ‘./components’这里,from的路径’./components’就是个文件夹。于是,按照前面的规则,首先查看文件夹下是否有package.json:并没有package.json。package.json不存在,那么查找index.js。index.js是存在的,于是加载。打开index
2021-09-23 17:10:56
1444
原创 javascript 回调函数数字一直加1
cutt_x(Arr = {}, param = {}, current = 0){ current++; that.cutt_x(Arr, param, current);}
2021-09-06 17:13:09
197
原创 javascript 图片推拽到图片上覆盖
思路:图片设置z-index为最底部,再添加一个div模板设置为z-index: 999 这样拖拽文件会触发新建的div,然后在drop事件修改图片的dom <el-image :src="URL" v-if="isShowImg" style="width: 770px; height: 433px" :preview-src-list="[URL]" > <div id=
2021-09-06 16:13:35
672
2
原创 vue 拖拽文件上传图片
<div id="dragDropDiv" ref="allimg"></div> mounted() { setTimeout(() => { var that = this; let allimg = document.getElementById("dragDropDiv"); allimg.ondragenter = allimg.ondragover = allimg.ondraglea
2021-09-03 17:40:59
190
原创 关于Error in callback for watcher “items“: “ReferenceError: items is not defined“
写代码时,name是一个[0,1]的数组 通过深拷贝传进来的参数解决问题 configureAssignment(state, name) { // debugger // var _obj = JSON.stringify(name); // name = JSON.parse(_obj); if (name[0] == null){ state.uploadparameter.epoch = "16" state.u
2021-08-30 17:32:43
4005
原创 解决在vue中axios请求超时的问题
自从使用Vue2之后,就使用官方推荐的axios的插件来调用API,在使用过程中,如果服务器或者网络不稳定掉包了, 你们该如何处理呢? 下面我给你们分享一下我的经历。具体原因最近公司在做一个项目, 服务端数据接口用的是java输出的API, 有时候在调用的过程中会失败, 在谷歌浏览器里边显示Provisional headers are shown。按照搜索引擎给出来的解决方案,解决不了我的问题.最近在研究AOP这个开发编程的概念,axios开发说明里边提到的栏截器(axios.Intercepto
2021-08-30 17:30:02
3511
原创 js传输图片路径
js传输图片路径数据库中存储数据/commons/img/***.jpg格式的图片路径。 "<a onclick=\"showImg(\'"+dataEle.imgPath.replace(/\\/g,'\\\\')+"\')\">查看图片 "显示时要.replace(/\/g,’\\’),将所有\替换为\才能传输路径否则会报错。...
2021-08-04 10:33:49
251
原创 this.$refs 与 v-if 的冲突解决方法
this.$refs 与 v-if 的冲突解决方法因为if渲染的原因,所以refs还没挂载上去,所以打印这个this.$refs == undefined解决方法: console.log(this.$refs) //无 setTimeout(() => { console.log(this.$refs) //有 }, 0);...
2021-08-03 19:10:51
1441
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人