weixin_45472408-CSDN博客

原创 canvas绘制时钟光明 | 黑暗主题

canvas绘制时钟光明 | 黑暗主题先上效果图canvas时钟的绘制参考了 # Sunshine_Lin大佬的# 为了让她10分钟入门canvas，我熬夜写了3个小项目和这篇文章这篇文章，具体样式是参考了B站 @Webb-L 的视频，然后以这两个为基础做了这个小demo我个人认为比较有难点的就是四个阴影的绘制// 外右下阴影ctx.shadowOffsetX = 10; // 阴影Y轴偏移ctx.shadowOffsetY = 10; // 阴影X轴偏移ctx.shadowBlur =

2021-08-13 13:49:23 207

原创函数的解构赋值（ES6知识点汇总---第二章）

函数的解构赋值函数的参数也可以使用解构赋值。function add({x, y}){ return x + y}add([1, 2]) //3上面的代码中，函数add的参数表面是一个数组，但在传入参数的那一刻，数组参数就被解构成变量x和y。对于函数内部的代码来说，它们能感受到的参数就是x和y。下面是另一个例子：[[1, 2], [3, 4]].map(([a, b])=> a + b);// [ 3, 7 ]函数参数的解构也可以使用默认值。function move({x

2021-07-02 00:57:57 232

原创字符串、数值和布尔值的解构赋值（ES6知识点汇总---第二章）

字符串的解构赋值字符串也可以解构赋值，这是因为此时字符串被转换成了一个类似数组的对象。const [a, b, c, d, e] = 'hello';a //hb //ec //ld //le //o类似数组的对象都有一个length属性，因此还可以对这个属性进行解构赋值。let { length : len } = 'hello';len //5数值和布尔值的解构赋值解构赋值时，如果等号右边时数值和布尔值，则会先转为对象。let {toString: s} = 123;s

2021-07-01 00:29:57 194

原创对象的解构赋值（ES6知识点汇总---第二章）

对象的解构赋值解构不仅可以用于数组，还可以用于对象。let { foo, bar} = { foo:"aaa", bar:"bbb"};foo // "aaa"bar // "bbb"对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值是由它的位置决定的；而对象的属性没有次序，变量必须与属性同名才能取到正确的值。let { bar, foo} = { foo:"aaa", bar:"bbb"};foo // "aaa"bar // "bbb"let { baz } =

2021-06-30 00:08:00 210

原创数组解构赋值（ES6知识点汇总---第二章）

1、定义ES6允许按照一定模式从数组和对象中提取值，然后对变量进行赋值，这被称为结构（Destructuring）。2、用法在ES6之前为变量赋值只能直接指定值，例如：let a = 1;let b = 2;ES6允许进行如下写法：let [a,b,c] = [1,2,3];上面的代码表示，可以从数组中提取值，并按照对应位置对变量进行赋值。本质上这种写法属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。let [foo,[[bar],baz]] = [1,[[2

2021-06-28 00:29:12 103

原创 ES6 “...“ 扩展运算符 (点点点)

1、定义扩展运算符（spread）是三个点（…），它如同rest参数的逆运算，将一个数组转为用逗号分隔的参数序列。2、使用console.log(...[1,2,3]); //1 2 3 console.log(1,...[2,3,4],5); // 1 2 3 4 5console.log(0,...[1,2,3,[4,5]],6); //0 1 2 3 [ 4, 5 ] 6该运算符主要用于函数调用。function add(x,y){ return x + y;}let num

2021-06-27 00:56:18 626

原创 let const命令（ES6知识点汇总---第一章）

前言：ES6平时在工作中应用诸多，但掌握的都太浅显，用的也都很基础，于是买了本阮一峰的《ES6标准入门（第三版）》，在看这本书的同时也寄希望能借助写博客的方式帮助自己重新梳理、记忆相关知识点以及养成写博客的习惯。在这个系列里我整理的基本都是书上已有的，会加入一些自己的理解，并做一些适当的缩减，如有错误望指出[抱拳]感谢！1、let和const命令1.1 let命令let命令是ES6新增命令，用于声明变量。用法类似于var，但是声明的变量只在let命令所在的代码块内有效。{ let a

2021-06-26 01:13:47 102

原创 vue移动端实现悬浮可拖动且滑动页面时收缩至内侧按钮

效果图按钮我用的是一个返回图片，这里你可以自定义按钮文字和宽高，父页面传参就可以了。我是在vue移动端实现可拖动悬浮按钮上进行的修改，加了一个滑动收缩组件代码<template> <div class="float_button"> <div @click="onBtnClicked" ref="floatButton" class="float_info" :style="{'width':

2021-04-29 11:52:40 794

原创微信小程序生成二维码

需引入weapp-qrcode.js下载https://blog-static.cnblogs.com/files/-tiantian/weapp-qrcode.js，点开链接按 ctrl + s 保存到对应的位置页面引入let drawQrcode = require("../../js/weapp-qrcode")wxml<canvas style="width: 600rpx; height: 600rpx;" canvas-id="myQrcode"></canvas

2021-01-28 11:06:38 126

原创 js 微信小程序根据身份证号计算年龄

封装成js文件function getAge(identify) { var UUserCard = identify; if (UUserCard != null && UUserCard != '') { //获取年龄 var myDate = new Date(); var month = myDate.getMonth() + 1; var day = myDate.getDate(); var age = myDate.getFu

2021-01-28 11:00:40 1001

原创微信小程序按钮超时禁用

以微信小程序为例，其他原理相同效果图wxml<button bindtap="getBangDing" disabled="{{buttonShow}}" type="primary">绑定用户({{buttonTime}})</button>jsjs databuttonShow:'false',buttonTime: '180', // 按钮失效倒计时 // 180秒后禁用绑定按钮 var inter = setInter

2021-01-26 16:01:11 744 1

原创微信小程序获取用户手机号

微信小程序获取微信绑定手机号效果图获取微信绑定手机号，更换手机号可以点下方“管理手机号码”，微信会给更换的手机号发送验证码进行验证，验证通过就可以正常获取。不用自己去配置短信验证手机号的正确性，用的是微信的短信服务。json用的WxUI,如何引入就不多说了，网上一搜一大堆{“usingComponents”: {“mp-cells”: “…/…/…/miniprogram_npm/weui-miniprogram/cells/cells”,“mp-cell”: “…/…/…/minipr

2021-01-26 13:16:10 680 1

转载 vue-quill-editor富文本编辑器自定义工具栏

基于webpack和vue一、npm 安装 vue-quill-editor二、在main.js中引入import VueQuillEditor from 'vue-quill-editor'// require styles 引入样式import 'quill/dist/quill.core.css'import 'quill/dist/quill.snow.css'import 'quill/dist/quill.bubble.css'Vue.use(VueQuillEd.

2020-07-16 20:17:27 1211 1

转载 vue 对象数组去重

vue 对象数组去重（转载方便自己回看）其实很简单，一般的数组去重可以直接用 new Set() 方法即可，但是数组对象的话，比较复杂，不能直接用，我们可以采取间接的方法来去重unique(arr) {const res = new Map();return arr.filter((arr) => !res.has(arr.id) && res.set(arr.id, 1))}下面有一个示例，根据对象的id作为去重的依据：<el-button type=“

2020-07-16 00:34:48 1591

原创 vue cli 2.9.6升级至最新版本

1、打开cmd2、输入npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载旧版3、使用npm install -g @vue/cli 或 yarn global add @vue/cli 安装最新版4、输入 vue-V 查看版本，@vue/cli 4.4.6成功！官方文档：https://cli.vuejs.org/zh/guide/installation.html...

2020-07-01 17:28:21 1948

原创 js/vue/小程序字母大小写转换

js字母大小写转换方法：1、转换成大写：toUpperCase()2、转换成小写：toLowerCase()3、举例：（1）var a=“aBcD”;a=a.toUpperCase();alert(a);提示出来的就是 ABCD（2）var a=“aBcD”;a=a.toLowerCase();alert(a);提示出来的就是 abcd...

2020-06-19 19:22:41 3497

原创图片加<span><h1>时<span><h1>内文字无法垂直居中的解决办法

试了水平居中：text-align:center；垂直居中：line-height，都无法解决问题，最后加了vertical-align 属性得以解决。代码效果图

2019-10-31 11:12:59 1079

原创 vue 页面跳转路由传参

vue 页面跳转路由传参仅供参考，前端小白①添加点击事件点击事件内也可跟接口变量② js代码内增加点击方法③ 路由接收参数

2019-10-28 12:22:34 244

weixin_45472408的博客