- 博客(25)
- 收藏
- 关注
原创 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
3440
原创 vue3 + ts + vite 学习笔记 (使用props传递复杂类型的数据)
在使用 TypeScript 的情况下,直接获取子组件的数据,肯定会出现报错;因为 HTMLElement 接口,不存在子组件的字段;
2022-02-08 13:41:47
2406
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
916
原创 运行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
1030
原创 Vue3 + vite 学习笔记
一、 搭建第一个 Vite 项目https://vitejs.cn/guide/项目模板的话暂时没有,只能创建个最基础的项目。二、初试setup()所有的逻辑代码都写在这个函数中。computed()与vue2中computed配置功能一致
2021-11-01 17:40:14
354
原创 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
468
原创 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
1244
原创 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
556
原创 JavaScript基础
JavaScriptJavaScript 基础最新的 ECMAScript 2020 标准定义了 8 种数据类型:基本类型引用类型&& || !! 运算符分别是什么意思?能做什么?浅拷贝与深拷贝分别是什么意思?有什么区别?对象解构展开运算符箭头函数Object.assign 深拷贝还是浅拷贝?null 和 undefined 的区别?Array everyArray some进阶多个异步任务并发运行Promise.all()如何获得粘贴内容?JavaScript 基础最新的 ECMA
2021-04-23 00:37:38
91
原创 js 关闭页面时弹框提醒
合并数组为一个新的数组你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:全新的界面设计 ,将会带来全新的写作体验;在创作中心设置你喜爱的代码高亮样式,Markdown 将代码片显示选择的高亮样式 进行展示;增加了 图片拖拽 功
2021-03-19 16:58:36
3500
原创 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
2236
原创 两个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
272
原创 uniapp-图片放大
uniapp-图片放大单个图片 previewImges(url) { let imgsArray = []; imgsArray[0] = url uni.previewImage({ current: 0, urls: imgsArray }); }
2021-01-27 11:46:37
951
原创 解决循环中的点击事件传item,打印为undefined的问题
传参item,打印为undefined的问题由于自己经验不是很丰富的原因,在项目中一点击事件传参,打印出来一直是undefined,明明自己传的是item,页面渲染也没问题,排查了许久,百思不得其解。后面又仔细的把数据看了一遍,发现返回的数据里没有id,换成:key="inedx"后,打印结果正常,结果真的是让人哭笑不得,所以在这分享一下...
2021-01-18 18:12:47
620
原创 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
492
原创 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
2683
原创 uniapp-发送验证码(节流)
uniapp-发送验证码(节流)做项目时在写发送验证码的时候忘记写节流,写完后测试时才发现,写的时候又突然忘记写法了,决定还是记下来为好,还算比较简单,一看就能看懂;代码如下:export default { data(){ return{ totalTime: 60, canClick: true, // 节流 clockTimer: null, //定时器 codeText: '获取验证码', } }, methods: { onSendCode() {
2021-01-12 15:46:11
718
原创 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
10176
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
3030
原创 用*代替身份证/手机号中间的数字
身份证/手机号把中间的数字用*代替//手机号 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
1235
原创 二级对象的键值赋给一级对象
二级对象的键值赋给一级对象 let [evaluateContend, evaluateTime, status, id, top] = [ "evaluateContend", "evaluateTime", "status", "id", "top"
2020-12-31 12:19:21
259
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
3558
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人