- 博客(25)
- 收藏
- 关注
RSS订阅原创 js-image-compressor 图片压缩插件
1.安装插件npm i js-image-compressor2.引入import ImageCompressor from 'js-image-compressor'3.使用 compressionImage (file) { return new Promise((resolve, reject) => { // eslint-disable-next-line no-new new ImageCompressor({
2022-04-02 11:58:08
3271
原创 vue3 + ts + vite 学习笔记 （使用props传递复杂类型的数据）
在使用 TypeScript 的情况下，直接获取子组件的数据，肯定会出现报错；因为 HTMLElement 接口，不存在子组件的字段；
2022-02-08 13:41:47
2313
1
原创 vue3 + ts + vite 学习笔记 （老 ref 与 新 ref 混用）
老 ref 与 新 ref 混用文章：Vue 官方文档 - 模板引用链接：https://v3.cn.vuejs.org/guide/composition-api-template-refs.html使用组合式 API 时，需要事先声明 ref 并在 setup() 返回；使用 TypeScript 的时候，ref 默认值为 null 同时变量类型也为 null 的话，后续的参数调用，则会出现类型报错，这时候需要使用到 泛型 + 接口；注解：好像虚拟 DOM 没有接口，只能通过泛型来替代；c
2022-01-07 16:14:30
854
原创 运行Serve报错Vue和vue-template-compiler版本不一致问题
在vue项目运行时终端报错package.json中Vue和vue-template-compiler版本不一致，提示vue和vue-template-compiler版本不匹配的问题，解决办法：先执行npm uninstall vue-template-compiler；然后再执行npm install vue-template-compiler@报错中提示的vue的版本号；安装完后再次运行即可。...
2021-12-14 10:49:10
1001
原创 Vue3 + vite 学习笔记
一、 搭建第一个 Vite 项目https://vitejs.cn/guide/项目模板的话暂时没有，只能创建个最基础的项目。二、初试setup()所有的逻辑代码都写在这个函数中。computed()与vue2中computed配置功能一致
2021-11-01 17:40:14
304
原创 video 自动循环播放的问题
video 自动循环播放video只加autoplay并不能自动播放，还需要再加上muted <video class="covervid-video" autoplay loop muted> <source src="./videos/9b23cc1032ae0346365d14733a262d35.ogg" type="video/ogg" /> <source src="./videos/9b23cc1032ae0346365d14733a262d35
2021-06-23 11:27:37
422
原创 css 双击选中文字时取消蓝色色块
js 双击选中文字时取消蓝色色块只需要在css中设置 user-select属性为none即可div{ user-select:none; -ms-user-select:none; // IE -moz-user-select:none; // 火狐 -khtml-user-select:none; // 早期浏览器 -webkit-user-select:none;}...
2021-05-14 13:58:25
1109
原创 vue 修改浏览器滑块样式
vue 修改浏览器滑块样式在style中：::-webkit-scrollbar // 滑块宽度{ width: 3px; // height: 1px;}::-webkit-scrollbar-track { //轨道部分 // box-shadow: inset 0 0 5px rgba(0,0,0,0.2); // background: #ededed; // border-radius: 3px;}// 定义滑块 内阴影+圆角::-webkit-scroll
2021-05-14 13:47:58
529
原创 JavaScript基础
JavaScriptJavaScript 基础最新的 ECMAScript 2020 标准定义了 8 种数据类型:基本类型引用类型&& || !! 运算符分别是什么意思？能做什么？浅拷贝与深拷贝分别是什么意思？有什么区别？对象解构展开运算符箭头函数Object.assign 深拷贝还是浅拷贝？null 和 undefined 的区别？Array everyArray some进阶多个异步任务并发运行Promise.all()如何获得粘贴内容?JavaScript 基础最新的 ECMA
2021-04-23 00:37:38
73
原创 js 关闭页面时弹框提醒
合并数组为一个新的数组你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客：全新的界面设计 ，将会带来全新的写作体验；在创作中心设置你喜爱的代码高亮样式，Markdown 将代码片显示选择的高亮样式 进行展示；增加了 图片拖拽 功
2021-03-19 16:58:36
3428
原创 uniapp-顶部胶囊按钮组件
组件代码如下：<template> <view class="navigation-bar" :style="'height:'+height"> <view class="navigation-bar-fixed" :style="{height:height,background:(!config.transparent&&!config.linear)?config.bgcolor:'transparent'}"> <!-- ca
2021-01-28 10:31:43
2141
原创 两个undefined的值拼接会有length的情况
两个undefined的值拼接会有length的情况在做项目时需要用到一个值去做if判断，而这个值是由另外两个值拼接起来的字符串 try{ let delec=await new this.Request(this.apiy.getm().tongzhi).gety(); let datas=delec.data.code=="200"?delec.data.data:[]; this.texty=datas.noticeName+","+datas.noticeC
2021-01-27 18:56:47
238
原创 uniapp-图片放大
uniapp-图片放大单个图片 previewImges(url) { let imgsArray = []; imgsArray[0] = url uni.previewImage({ current: 0, urls: imgsArray }); }
2021-01-27 11:46:37
902
原创 解决循环中的点击事件传item，打印为undefined的问题
传参item，打印为undefined的问题由于自己经验不是很丰富的原因，在项目中一点击事件传参，打印出来一直是undefined，明明自己传的是item，页面渲染也没问题，排查了许久，百思不得其解。后面又仔细的把数据看了一遍，发现返回的数据里没有id,换成:key="inedx"后，打印结果正常，结果真的是让人哭笑不得，所以在这分享一下...
2021-01-18 18:12:47
585
原创 uniapp-发起微信支付
uniapp-发起微信支付直接上代码：uni.requestPayment({ nonceStr: res.data.nonce_str, // 调取下单接口后台返回的数据 package: `prepay_id=${res.data.prepay_id}`, // 必须加前缀prepay_id=xxxxxxxx paySign: res.data.paySign, // 调取下单接口后台返回的数据 signType: "MD5", // 调取下单接口后台返回的数据 tim
2021-01-18 18:00:02
464
原创 uniapp-获取当前时间将其格式化
uniapp-获取当前时间将其格式化在项目里新建一个commit文件夹，添加一个datetimes.js的文件代码如下：function datastime(type){ let myDate = new Date(); //获取当前时间 let yinian=myDate.getFullYear(); //年 let yer=parseInt(myDate.getMonth())+1;//月份 if(yer<=9){yer="0"+yer;} let riqi=myDate.get
2021-01-15 09:22:04
2547
原创 uniapp-发送验证码(节流)
uniapp-发送验证码(节流)做项目时在写发送验证码的时候忘记写节流，写完后测试时才发现，写的时候又突然忘记写法了，决定还是记下来为好,还算比较简单，一看就能看懂；代码如下：export default { data(){ return{ totalTime: 60, canClick: true, // 节流 clockTimer: null, //定时器 codeText: '获取验证码', } }, methods: { onSendCode() {
2021-01-12 15:46:11
695
原创 uniapp-省市区地区选择器
uniap地区选择器之前在网上借鉴其他大佬的组件，用的时候发现点问题，地址对不上，后面又重新搞了个文件，做了点改动data.js链接: https://pan.baidu.com/s/1FlN7qHiiL_NFU94f9nnIYg. 提取码: 95shpickerAddress.vue<template> <picker @change="bindPickerChange" @columnchange="columnchange" :range="array" range-ke
2021-01-06 16:37:38
9955
16
原创 uniapp图片上传至后台
uniapp图片上传至后台直接上代码：uni.chooseImage({ count: 1, sizeType: ['original', 'compressed'], sourceType: ['camera', 'album'], //camera拍照，album打开手机相册 success: (res) => { let arr = res.tempFilePaths[0] //这里接收的时上传图片的本地路径 uni.uploadFile(
2021-01-06 11:46:03
2954
原创 用*代替身份证/手机号中间的数字
身份证/手机号把中间的数字用*代替//手机号 var str = 18111324626 var str1 = srt.substr(0,3)+"****"+str.substr(7); // 181****4626 //身份证 var str3 = 510821170607052110 var str4 = srt.substr(0,4)+"******"+str.substr(14);//5108******2110...
2021-01-06 11:34:58
1163
原创 二级对象的键值赋给一级对象
二级对象的键值赋给一级对象 let [evaluateContend, evaluateTime, status, id, top] = [ "evaluateContend", "evaluateTime", "status", "id", "top"
2020-12-31 12:19:21
244
1
原创 css 按钮颜色渐变效果
css 按钮颜色渐变效果通过设置元素的background中linear-gradient，后面加上颜色渐变的方向和颜色，代码奉上：// 从左到右的渐变效果 background: linear-gradient(left, #FFB9DA, #FF98C7,#FFFFFF); // 颜色可设置双色 background: -webkit-linear-gradient(left, #FFB9DA, #FF98C7,#FFFFFF); background: -moz-linear-grad
2020-12-31 11:25:33
3506
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人