自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

HHH917的博客

来自2018末的大学生自学者

  • 博客(157)
  • 资源 (5)
  • 收藏
  • 关注

原创 webstorm 使用prettier格式化保存 导致代码缩进与gitlab代码不一致问题

webstorm显示缩进正常。gitlab显示不正常。

2024-03-18 11:30:23 238

原创 00.本地搭建 threejs 文档网站(网页版是外网比较慢)

github 下载https链接地址 https://github.com/mrdoob/three.js.git。进入官网 可以选择github去下载 或者 下载压缩包。

2023-11-28 23:13:42 2165

原创 01-three_basic 使用three.js渲染第一个场景和物体

【代码】01-three_basic 使用three.js渲染第一个场景和物体。

2023-11-28 23:00:45 2034

原创 JECloud 运行前端模块所遇到的问题(持续学习汇总)

如果已经全局安装了 yalc 和lerna pnpm 那些全局依赖 使用nvm 切换到低版本node 后需要重新安装!但是需要注意的是 切换版本时 尽量使用默认路径安装nvm 否则可能会导致 全局安装依赖出现。只要nvm 是默认安装路径 和 %NVM_SYMLINK% 指向的路径一致就可以了!在部署前 如果当前node版本过高可以使用 nvm工具 切换到低版本,可以先下载 jecloud-libs 项目 尝试 部署安装。在系统属性 环境变量 Path 里添加。nvm 安装出现环境问题可以参考。

2023-05-16 12:17:34 3043 1

原创 h5 判断是否进入 可视区域内 (自动播放 video )

需要注意的是,IntersectionObserver polyfill 会增加一些额外的开销,因此在支持 IntersectionObserver 的浏览器中,最好还是使用原生的 IntersectionObserver。可以使用 Intersection Observer API 监听视频元素是否进入可视区域,如果进入可视区域则自动播放视频,同时设置视频静音。上述代码中,我们创建了一个 Intersection Observer 对象,用于监听视频元素是否进入可视区域。属性来设置视频元素的填充方式。

2023-05-08 12:10:06 1342

原创 uniapp或者微信小程序 对输入框进行拦截不重新渲染(只输入数字拦截成功但是页面不渲染更新)问题解决

input 事件进行拦截 打印 e.target.value的值变化了,但是页面不重新渲染。输入11ab3 正则进行拦截更改 e.target.value的值更改了113。输入11ab 正则进行拦截更改 e.target.value的值还是是11。输入11a 正则进行拦截更改 e.target.value的值还是是11。输入 11 e.target.value的值是11。就是因为拦截后的值没变导致页面不重新渲染。

2023-03-29 10:15:04 1098

原创 uniapp使用 movable-area movable-view 实现图片双指缩放、鼠标单击缩小双击放大、图片及标记点功能

movable-viewmovable-area movable-view 主要是可以实现缩放及拖拽功能,不过只能限制在movable-area 范围内的拖拽超出范围会回弹。为了增大一点它的回弹范围 可以设置 movable-view的宽高为0;然后子元素决定定位居中。微信小程序没有双击事件 通过setTimeout 拦截并判断是单击还是双击。实现代码(部分无用组件自行删除)getDomInfopartDetail.js组件代码

2023-02-24 15:14:08 6148 5

原创 vue2 uniapp Tree 树形控件基础 组件

【代码】vue2 uniapp Tree 树形控件基础 组件。

2023-02-09 14:40:53 2597

原创 uniapp 父组件给子组件传值为Object类型报错 Bad attr `xxx` with message 问题解决

可能是 uniapp 转换 为 微信小程序的bug。写法传值给子组件 会报错。

2023-02-09 12:07:48 1666

转载 vue 自定义指令 自动添加省略号 ellipsis

vue 自定义指令 自动添加省略号 ellipsis

2023-01-13 17:25:31 634

原创 element-ui el-table表格组件 动态合并列

tableOptions 属性中包含了需要合并的表格列项列表columnIndexList 及判断 prop名称 proName。objectSpanMethod 通过判断 tableOptions 实现合并列。在tableData 数据 需要合并的项插入 tableOptions 属性。主要是原始的tableData表格数据。然后 使用 合并行或列的计算方法。codepen 预览地址。

2023-01-10 14:45:45 984

原创 js 深度克隆deepClone多种方式解决循环引入问题深拷贝

js 深度克隆deepClone多种方式解决循环引入问题深拷贝 SON.parse(JSON.stringify()) MessageChannel lodash.cloneDeep Object.create和Object.defineProperty WeakMap

2022-12-28 17:23:43 1337

原创 vue3 图片放大缩小、拖拽功能(自定义指令)

const oDiv = el // 当前元素 const minTop = oDiv . getAttribute("drag-min-top") const ifMoveSizeArea = 20 oDiv . onmousedown =(e) => {

2022-12-28 15:25:46 4363

原创 vue3 + vite Cannot access ‘xxx‘ before initialization 组件热更新失败,es模块循环引用问题

pinia 下 modelCache.ts 文件使用了router 并Model组件中 引入了modelCache.ts 该文件 这样导致es模块循环 vite热更新失败。本人 在 pinia stores 文件中使用了 router ,而main.ts 已经引入过router。pinia 下 modelCache.ts 文件 router 引入方式改为 函数引入。因为 useRouter() 要在setup下使用。pinia 下 modelCache.ts 文件。

2022-12-26 11:58:03 15353

原创 vue3+vite +element-plus+tailwindcss兼容低版本浏览器(uc)

tailwindcss v2的 jit模式 和 任意值 arbitrary value 语法 已经足够好了。uc浏览器 对于 tailwindcss boxShadow 不支持 主要还是rgb原因。npm build 打包后 低版本浏览器才能打开 开发模式下低版本浏览器还是一片空白。uc浏览器 rgb支持不全 如rbg(0 0 0 /30%) 这种写法不支持。使用 tailwindcss @2.2.16 版本 v3低版本不支持。tailwindcss v3 部分样式在低版本下也不支持。

2022-12-23 17:11:33 4905

原创 在微信小程序使用fixed布局固定input 输入框,iPhone ios系统无法获取焦点问题解决。

查看微信小程序开发文档 对input的介绍 https://developers.weixin.qq.com/miniprogram/dev/component/input.html。强制 input 处于同层状态,默认 focus 时 input 会切到非同层状态 (仅在 iOS 下生效)微信小程序 是fixed布局后 ios版本 input 输入框 无法选中 但是长按可以获取焦点。添加 always-embed 属性 即可解决问题。发现了 always-embed 属性。

2022-11-03 17:31:34 1871

原创 uniapp vuecli 启动 dev模式下 已勾选压缩但无法压缩问题 解决

使用折中的办法 虽然可以解决一些问题 ,但是如果dev开发模式下文件没有压缩 会导致 vendor.js 文件过大 最终会导致hubuiberX 运行某一个页面组件报错 ,导致代码无法热更新 程序无法写下去。HBuiderX 运行小程序时已勾选 运行时是否压缩代码选项 但是代码并未被压缩。hubuiberX 无法压缩 上传代码不了微信平台 也可以使用hubuiberX的发布模式进行压缩解决。代码可以设置开发预览是体积调整为4m来解决编辑问题,但是文件过大,无法预览及真机预览。

2022-10-18 17:22:06 1476

原创 css nth-child 的使用

nth-child 选择器 选择指定选择器的父元素下的 指定选择器元素如 .nthC:nth-child(n){} 选择的是 当前.nthC class类元素的父元素 的所有 含有.nthC的子元素使用 nth-child(n) 方式 n>=1 时生效。css计算时 n 从0开始计算。结果可以看出与.nthC同级的元素中 第二个没class的元素没有变红色结果css使用的是 nth-child(even) 选择偶数。可是与.nthC同级的元素中 第二个元素没有.nthC类,所以不受.

2022-09-22 10:29:31 1268

原创 uniapp 修改引入组件样式 使用/deep/、::v-deep、>>>不生效 解决

当使用 /deep/ 或者 ::v-deep 修改第三方组件不生效时 可以配置如下参数。

2022-09-08 18:02:14 9107 9

原创 uniapp使用taiwindcss多平台开发并保持原生写法插件

weapp-tailwindcss-webpack-plugin 插件作者的另一款插件 tailwindcss-miniprogram-preset 我已在项目中使用过 并使其兼容h5 微信小程序 APP 但是 tailwindcss-miniprogram-preset 插件需要自己配置预设 且没有使用jit引擎 加载使用比较慢 配置也相对麻烦。weapp-tailwindcss-webpack-plugin 的github文档也是很完整 相关demo也比较友善。......

2022-08-26 11:30:53 2390 1

原创 vue 或 js 使用谷歌翻译实现国际化

但由于使用浏览器中的谷歌翻译插件 会导致dom的结构发生改变,从而导致 vue react与dom操作绑定关系失效!其中( 翻译input提示内容 无法翻译),需要在public 的添加css及js 已放置在。下面的方法可以使得我们即使用谷歌翻译 又不会导致dom结构发生改变 兼容vue react(把vue代码改写一下)框架。这两个组件都可以通过 添加 notranslate 类名,这样谷歌翻译将不会翻译该元素内文字。一般没有适配国际化的页面 我们会使用谷歌翻译插件进行翻译。demo 代码 如下。..

2022-08-24 15:42:33 4732 3

原创 jira-dev-tool 安装完成 请求接口报404问题

代码】jira-dev-tool 安装完成 请求接口报404问题。

2022-08-10 10:37:23 609

原创 vue 2.9.6 无法升级到vue3版本问题

所以我怀疑是yarn的问题使得npminstall-g@vue/cli安装的全局vuecli脚手架命令指向的文件不是npm内的node_modules而是yarn里面的node_modules。卸载了yarnnode_modules路径下的@vue及yarn下面的vuevue.list等关于vue的文件。yarnnode_modules依赖下重新生成了@vuevuecli依赖包但是运行vue-V仍然是2.9.6。...

2022-07-26 18:23:11 931

原创 vite 本地运行首次进入页面加载慢问题

webpack切换到vite,如果单看命令行中的运行,运行完毕不到一秒,不过首次打开页面则需要等10秒到20秒左右的处理时间请求数量达到了132个(浏览器对于这种并发请求会产生阻塞的),这里的文件最大了也是tailwindcss,并且打开按需加载的页面路由时,还需要经过tailwindcss编译css,打开未打开过的页面还需等几秒时间,这个体验非常差。添加依赖项首次打开页面时,当’‘include’'中的数组不包含该依赖项时命令行会提示出来添加进去即可。我们都可以知道可以添加到依赖项。...

2022-07-25 16:39:33 14321 4

原创 React useMount 组件挂载时执行一次

React useMount组件挂载时执行一次。

2022-07-22 11:20:01 1797

原创 React useDebounce 防抖原理

useDebounce搭配useEffect使用。

2022-07-22 11:13:31 1477

原创 解决 苹果ios input输入框弹出输入法 但是 无法输入内容问题

代码】解决苹果iosinput输入框弹出输入法但是无法输入内容问题。

2022-07-20 11:14:37 1722

原创 webpack 迁移至 vite 注意事项 基于vue3+ts(持续汇总)

require是node.js提供的模块 Webpack使用了node 使得编辑vue时可以使用require但是vite不支持而且图片在标签src中的路径不可以使用@ 别名获取绝对路径css style中也不可以使用别名 ~@ 获取图片 文字等静态资源替代方式 vite 静态资源处理可以封装一个函数进行调用 根据不同的静态路径设置不同的函数pub-use.ts使用 pub-use.ts2. 组件不传参时 props不可以设置为空 否则打包错误错误示例 vite打包报错 Type ‘{

2022-07-14 11:50:43 1605 1

原创 vue 使用 prerender-spa-plugin 预处理 seo优化 导致 history模式 页面刷新 文件加载404 问题

nginx已经加了没有使用prerender-spa-plugin插件之前history正常,增加插件后刷新文件加载异常main.js404问题原因及解决由于前端vue.config 配置的 publicPath 路径 使用了 './'相对路径(当时为了方便前端测试)正确方式publicPath 更改为’/'绝对路径...

2022-07-08 11:38:45 835

原创 树莓派 3b+ 学习

树莓派学习记录

2022-06-27 00:38:52 230

原创 windows 网络远程连接samba,并修改windows默认连接samba端口445到指定端口(支持监听ipv6 及ipv4 IP地址)

windnows 修改samba端口

2022-06-27 00:24:56 6638 4

原创 IPv6连接测试通过,但是无法ping成功问题解决(记录)

如果还是无法解决 可能是服务端主机电脑的 防火墙 入站规则中的 文件和打印机共享(回显请求 - ICMPv4-In) 或者 文件和打印机共享(回显请求 - ICMPv6-In) 被禁用了打开即可。还有一种情况就是 路由器根本找不到防火墙的配置选项 而且外网也是连接不上电脑的ipv6地址,这种情况只能更换路由器了。但是路由器下面就是你的电脑 当路由器打开了防火墙 可以会拦截外网访问电脑的ipv6地址。如果你的路由器 有防火墙 可能需要关闭路由器的防火墙;电脑本身防火墙拦截了。

2022-06-11 18:21:22 24389 3

原创 vue3 toRef 及toRefs 响应式失效( 自上而下 响应式失效 自下而上 可以响应式问题)(待解决)

toRef 及 toRefs 响应式失效问题

2022-06-06 12:30:11 2025

原创 vue3 关于数据已变化,视图渲染未变化问题(犯了低级错误) 总结

vue3 数据未被渲染 语法问题 总结

2022-06-06 11:22:30 6917 1

原创 IDEA控制台打印中文字符串乱码解决

解决file=> settings=>Editor=>File Encodings 图片中的文字集选项 都选择GBK (GBK) 在more选项中

2022-05-08 23:35:54 1628 5

原创 vue3.0 通过ref 动态绑定与获取 dom;

描述由于 vue3.0 不可以直接 this.$refs 获取绑定的ref dom元素vue3.0 只能通过如下 方式 绑定dom//html<div :ref="refDiv"></div>//setup 中const refDiv = ref();return{refDiv}但是这样绑定的dom 不是动态的 变量是写死的如果遍历绑定多个dom 这种方法行不通然后我就研究了如下方法通过 动态绑定 attribute属性及ref绑定函数 实现动态ref

2022-04-27 15:23:27 9795

原创 vue3 在setup 外部调用 useStore() 为 undefined 解决

效果如下例子 useStore()= undefined 但是 useStore( )是为了获取 store 可以直接引入store代替useStoreimport { useStore } from 'vuex'import _store from '@/store' // 拿到store独享 const store = useStore() || _store console.log('store 1', useStore) console.log('store 2', us

2022-04-26 11:37:12 11648 7

原创 js 解决获取图片乱码 将 Arraybuffer 转换为 base64 的两种方式

请求axios 添加 responseType: ‘arraybuffer’ axios .get('/Base/captcha?' + Math.random(), {}, { responseType: 'arraybuffer' })Arraybuffer 转换为 base64 方式一 window.btoa (已弃用) const base64Str = 'data:image/png;base64,' + btoa( new Uint8Arr

2022-04-24 14:13:39 4255 6

原创 使用 spacedesk 与 parsec 让安卓平板 或者电脑 作为电脑的拓展屏 的简单介绍

spacedesk关于spacedesk的介绍 我另一篇文章有提到 Windows电脑 添加 安卓或者苹果平板作为拓展屏(spacedesk )这里 主要是使用 spacedesk 的web浏览器连接使得电脑出现扩展屏 并通过web的连接配置屏幕参数这里spacedesk主要使得window或者扩展屏的驱动 所以 画质 什么的都可以调到最低 下面的parsec才是传输扩展屏画面的而扩展屏的图像传输则不是通过spacedesk的web实现 使用parsec p2p连接方式低延时连接传输扩展屏的

2022-04-23 12:34:02 11369 1

原创 uniapp 解决 h5 PC端 屏幕过大失真 问题

效果解决目前 我也暂时不知道为什么 有时候设置了 rpxCalcMaxDeviceWidth 后 当屏幕宽度超过 960px后 应该 750rpx 应该等于375px 但是有时候又不行所以目前有两种写法 一种是默认的 另一种是自定义 默认不行就使用另外一种pages.json "globalStyle" 对象中填写 如下默认"rpxCalcMaxDeviceWidth": 960, // rpx 计算所支持的最大设备宽度,单位 px,默认值为 960"rpxCalcBaseDeviceW

2022-04-06 17:57:18 3216 1

google-translate-vue

google-translate-vue 谷歌翻译vue插件 支持国内翻译(无需翻墙)或者科学上网二选一 。demo为vue组件代码 static文件夹为国内(无需翻墙)方案使用,需要放置在public 静态文件下。

2022-08-29

Web QR_files.rar

jsqrcode js实现 上传本地文件 识别二维码

2021-12-11

quaggademo.rar

quagga js 实现 h5 识别条形码

2021-12-11

librarydemo.rar

zxing js 实现 h5摄像头扫码 识别二维码及条形码

2021-12-11

jsQRdemo.rar

jsqr实现 h5 js 扫码二维码 demo

2021-12-11

vue-demo-pl-table.zip

pl-table 的vue使用demo 通过pl-table的可视区域渲染 解决vue+element使用el-table渲染表格数据过多卡顿的问题

2020-12-14

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除