- 博客(145)
- 收藏
- 关注
RSS订阅原创 Mac快捷键（换备忘录）
Mac快捷键快捷键 含义cmd+⬅️ 光标移到行左fn 🍎表情cmd+C/V/Z/A/X 复制/粘贴/撤销/全选/剪切空格 快速查看文件cmd+I 显示文件信息control+空格 切换输入法cmd+空格 全局搜索cmd+W 关闭当前窗口cmd+option+W 关闭软件所有窗口cmd+Q 退出软件cmd+S 保存cmd+T 新建标签页cmd+N 新建窗口cmd+shift+N 新建文件夹/新建无痕窗口cmd+M 窗口最小化cmd+control+F 全屏/退出全屏cmd
2022-03-28 17:09:22
1407
原创 npm切换其他源
npm get registry // 查看源npm config set registry xx // 切换源🌰例子npm config set registry https://registry.npmjs.org/ // 切换为npm
2022-03-28 11:48:57
516
原创 vscode设置记录
{ "workbench.iconTheme": "vscode-great-icons", // #值设置为true时，每次保存的时候自动格式化；值设置为false时，代码格式化请按shift+alt+F "editor.formatOnSave": false, // #每次保存的时候将代码按eslint格式进行修复 "eslint.autoFixOnSave": false, // 添加 vue 支持 "eslint.validate": [
2022-03-28 11:44:41
390
原创 跳转链接时加个时间戳
链接有？，直接加&参数；没有，加？再加参数// url this.url// t 时间戳，也可timestamplocation.href = this.url.indexOf("?")>-1?`${this.url}&t=${Date.now()}`:`${this.url}?t=${Date.now()}`;
2022-03-17 19:11:23
1188
原创 xxx is assigned a value but never used 报错
xxx is assigned a value but never used报错找到路径package.json文件 -> devDependencies -> rules添加以下代码 "rules": { "generator-star-spacing": "off", "no-debugger": "off", "no-tabs": "off", "no-unused-vars": "off", "no-console":
2022-03-10 10:17:48
1855
原创 eslint不识别全局变量
eslint不识别全局变量xxxxx在package.json文件，eslintConfig中添加globals"eslintConfig": { "root": true, "env": { "node": true }, "extends": [ "plugin:vue/vue3-essential", "eslint:recommended" ], "parserOptions": { "parser"
2022-03-02 16:50:21
1632
原创 微信h5页面右上角分享禁用项纪录
微信h5页面右上角分享禁用项纪录wx.hideMenuItems({ menuList: [ "menuItem:share:appMessage", // 发送给朋友 "menuItem:share:timeline", // 分享到朋友圈 "menuItem:share:qq", // 分享到QQ "menuItem:share:weiboApp", // 分享到Weibo "menuItem:favorite", // 收藏
2022-02-23 15:43:41
625
原创 websocket在vue中的使用
一、websocketwebsocket是什么？为什么要用websocket？websocket是一种网络通信呢协议，同http、https协议，是客户端与服务端通信用的，websocket创建在 TCP 上、通过HTTP/1.1 协议的101状态码进行握手。为什么要用websocket？试想以下场景：你妈妈在厨房做饭，你饿得不行，想马上吃到，但是妈妈不着急，她做完饭可能刷个锅洗个碗，你想在第一时间吃到饭，就得知道饭做好的消息，排油烟机声音太大得开门才能听到。用http连接：你（进厨房）：妈妈饭
2022-02-16 16:12:09
10498
2
原创 移动端h5游戏开发中的动画和动效展示
在移动端h5游戏开发中，经常会遇到动画和动效的展现需求，比较常用的实现方法有css3、svg、定时器等，针对不同的场景和需求使用不同的技术，可以提升设计和开发的效率，保证产品的效果和质量，也能让用户有更好的体验，以下是项目开发中使用过的动效例子。一、css3css3动画三剑客animation, transform, transition，项目中主要用到css3 animation，下面会进行重点介绍。css3 animation主要由三部分组成，关键帧、动画属性和css属性。关键帧@keyfram
2022-02-15 14:35:07
4233
原创 Google打开测试环境图片
一、1、chrome://flags/#block-insecure-private-network-requests2、Block insecure private network requests3、选disabled二、1、chrome://settings/content/insecureContent2、允许显示不安全内容3、[*.]xx.com
2022-01-26 18:12:36
342
原创 h5页面height设置100vh在safari浏览器显示问题
问题：h5页面高度height设置为100vh，底部按钮设置bottom为8vh，在微信和其他浏览器显示正常，safari浏览器中按钮显示不全产生原因：safari浏览器中height包括网址栏、功能列、wrap，IOS15更新后网址栏还跑到了页面下方功能列之上，看着就不舒服：）当然设置中可以修改，可自行百度其他浏览器height只包括wrapsafari为什么要这么设计呢，找到了篇文章，一大佬在GitHub中提的问题，其中一小哥调侃语气——This is completely intenti
2022-01-07 11:33:12
5295
1
原创 移动端h5图片加载问题，预加载、div标签替换img
在开发移动端h5时遇到图片加载不出来的问题，分为大图片和小图片（打包base64区分）大图片加载解决办法：reload预加载小图片加载解决办法：div标签替换为img标签特殊情况：div标签按钮有点击动效，即按下按钮时active替换为另一张图片按钮点击动效 .game-btn { position: absolute; width: 180px; height: 180px; margin-top: 280px; backgro
2021-12-17 14:56:58
1638
原创 vue项目中复制插件vue-clipboard2
复制功能插件：vue-clipboard2下载：npm install --save vue-clipboard2栗子：会更改三个文件下载后，package.json中增加vue-clipboard2进入src-main.js文件，增加以下代码import VueClipboard from "vue-clipboard2";Vue.use(VueClipboard);使用复制功能文件：<div id="app"></div> <template
2021-11-17 14:14:08
1021
1
原创 vue watch
watch: { num1(val) { console.log("===num1", num1); }, num2: { handler(val) { console.log("===num2", num2); }, // 对象 immediate: true // 立即执行 }}
2021-11-02 11:04:36
140
原创 文件上传优化方案
文件上传方法1、form、input2、formData（推荐）3、fileReader文件上传遇到问题1、大文件时，上传时间久，容易卡顿2、网络原因导致失败，失败后需要从头开始解决方案：1、切片上传2、断点续传3、秒传切片上传：Blob对象的slice方法chunkSize = 1024*5;（每片大小文件切片上传完成，文件合并1、前端发送完切片，发送切片请求，告诉后端可以合并2、后端读取切片数，自动检测文件是否上传完成（推荐）3、创建一个和原文件大小相同的文件……断点
2021-10-27 17:41:36
634
2
原创 h5页面调试及页面布局
h5页面调试：375603iPhone6/7/8 375667-路由title的尺寸布局：场景一：页面上半部分是列表，列表数据较多可下拉；页面底部是操作按钮，按钮固定，有高度。理想效果：列表部分正常滚动，按钮固定，滚动条只在上半部分，不涉及底部按钮区域。实现：大盒子设置flex，小盒子1设置flex为1，小盒子2设置高度。<div class="container"> <div class="table"></div> <div class=
2021-10-22 11:17:59
398
2
原创 Vue前端代码添加单元测试Unit Test
单元测试Unit Test（单测）单测好处多多，保证代码正确性、提高代码和技术水平、利于重构等等，但是前端写单测也很难，网上例子很少，业务需求迭代快，没有特殊要求和自我追求没人搞这个吧？哦，我为啥写，领导绩效写了，我就写了，写了就得做。领导搞后端的：）栗子万事开头难，百度减一半，推荐Vue测试指南1、安装vue脚手架yarn global add @vue/cli2、创建项目vue create zsy_ut，创建的时候，注意选择 “Manually select features” 和 “Uni
2021-09-23 19:06:06
1964
原创 记录下vscode的settings和extension配置
settings{ "files.autoSave": "onFocusChange", // 失去焦点后自动保存 "editor.tabSize": 2, // 重新设定tabsize "editor.formatOnSave": true, // 每次保存自动格式化 // 每次保存的时候将代码按eslint格式进行修复 "editor.codeActionsOnSave": { "source.fixAll.eslint": true }, // 在使用搜索功能时，
2021-09-03 14:39:38
1279
原创 JS校验上传图片类型
常见图像文件类型缩写文件格式MIME类型文件拓展名浏览器兼容性APNGAnimated Portable Network Graphics动态便携式网络图像image/apng.apngChrome, Edge, Firefox, Opera, SafariAVIFAV1 Image File FormatAV1 图像文件格式image/avif.avifChrome, Opera, Firefox (feature flag)BMPBitmap f
2021-08-30 17:03:21
1316
原创 css样式关键词缩写ad在火狐浏览器中不显示bug
错误示范，页面空白<div class="account-details"> <div class="ad-text"> Liz </div></div><style lang="scss" scoped>.account-details { margin: 10px; display: flex; flex-wrap: wrap; .ad-text { color: pink; }}</style>
2021-08-05 11:34:57
187
2
原创 css控制div、span按钮置灰，点击后不触发事件
<span :class=" props.row.status === 0 ? 'table-blue' : 'table-disable' " @click="showStatusModal(0, props.row.id)"> 下架</span>&-blue { cursor: pointer; color: blue; margin: 0 2px; text-align: center;}&-disable { pointer.
2021-08-03 15:12:11
3311
原创 谷歌浏览器长截图
打开谷歌浏览器F12或Ctrl+Shift+I打开调试器Ctrl+Shift+P打开功能界面Capture full size screenshot按回车搜screenshot也有各种截图方式供选择栗子
2021-07-30 11:32:22
160
原创 css文字两端对齐
规则：文字最长x个字符，width: xem;单个样式（长度y)：letter-spacing: （x-y)(y-1)em;margin-right: -（x-y)(y-1)em;栗子：最长6个字符<div class="content"> <label><div class="w6">开通成功短信</div>：</label> <span>{{ list.isMessaged }}</span></d
2021-07-22 19:56:55
176
原创 vue中style设置scoped后部分样式不生效
vue中为了使样式不影响其他页面，style设置了scoped。但设置后style中部分样式不生效，尤其是组件自身样式的修改。解决：可以在不生效的样式前加/deep/<style lang="less" scoped>/deep/ .el-table td:nth-child(1),/deep/ .el-table td:nth-child(3) { text-align: right;}</style>例子随便写的，效果不用这样实现，具体看文档。...
2021-07-20 09:48:49
2635
原创 搭建react项目
// 脚手架搭建项目create-react-app react_democd react_demo// 引入antdyarn add antd// 引入lessyarn add less less-loader --save-devyarn add customize-cra// 安装axiosyarn add axios// 安装react-routeryarn add react-routeryarn add react-router-dom// 安装reduxyarn a
2021-06-25 16:30:34
98
原创 vue和react遍历数组
vue<template> <div v-for="item of lizOptions" :key="item.id"> {{ item.id }} : {{ item.value }} </div></template><script>export default { data() { return { lizOptions: [{id: 1, value: "cat"}, {id: 2, value: "d
2021-06-24 20:00:15
298
3
原创 记一个GitHub大小写bug
上传了个项目，项目中只有手动创建的一个readme.md文件，在GitHub查看时发现文件名称打成小写的了，百度了下，GitHub默认忽略大小写，git config core.ignorecase false关闭GitHub大小写不识别功能。修改文件名为README.md重新提交代码：打开GitHub里面有两个文件：emmmmm w(ﾟДﾟ)w...
2021-06-23 17:53:51
275
原创 本地项目上传到GitHub上
1、本地项目代码提交git initgit add .git commit -m "update"2、GitHub上新建项目3、回到项目中执行代码// 项目地址git remote add origin https://github.com/xxx.gitgit branch -M maingit push -u origin main4、over
2021-06-22 14:53:38
99
原创 Python自学过程知识点总结
Python入门学习目标安装PythonPython基础输入输出数据类型方法、占位符列表Listtuple条件判断学习目标首先，为什么要学python呢？不想当全栈的程序员不是cool girl，java、C比较难，毕业半年还给老师了，基础python比较简单（没有说python简单的意思！！高级python以后再说)装x方便生活，因为python确实很好用有目标才有动力！目标：学会基础python，学会爬虫，可以在百度上爬下来一篇小说或诗词。安装PythonPython下载cmd执
2021-06-22 14:00:32
765
原创 vue添加nrm失败throw new ERR_INVALID_ARG_TYPE(name, ‘string‘, value)；
问题使用nrm添加公司私源失败，报错throw new ERR_INVALID_ARG_TYPE(name, 'string', value);解决1、鼠标移到TypeError第四行，(C:\Users\zhanshiyu\AppData\Roaming\npm\node_modules\nrm\cli.js:17:20)，Ctrl+鼠标点击，进入cli.js页面。2、替换第十七行代码：// const NRMRC = path.join(process.env.HOME, '.nrmrc')
2021-06-22 11:03:29
318
原创 AntD checkbox，限制选中数量
需求checkbox多选框最多选中两个，选中两个后其余选项置灰；取消一个或两个选项后，所有项可选。在网上找了一下，有这个需求但是没有实现，于是这里重写了一下，方便以后使用。操作1、选中一个选项2、选中两个选项，此时已选两项，未选项置灰3、取消一个选项，此时所有选项可选代码/** * checkout多选，最多选中两个，其余选项不可点击；取消选中后的项，所有选项可点击 */import React, { Component } from 'react';import { Chec
2021-06-03 17:38:47
3564
转载 js去除字符串空格
js原生方法trim()str = str.trim();局限：只能去除字符串两边空格let str = " 1 2 3 ";str0 = str.trim();// "1 2 3"正则表达式去除字符串所有空格str = str.replace(/\s*/g,"");去除字符串两边空格str = str.replace(/^\s*|\s*$/g,"");去除字符串左侧空格str = str.replace(/^\s*/g,"");去除字符串右侧空格str = str.r
2021-06-03 14:51:46
147
原创 AntD Upload在React useState中使用问题
主要代码<Upload action="https://www.mocky.io/v2/5cc8019d300000980a055e76" listType="picture-card" fileList={infoList} onPreview={(val:any)=>{ setName(val.name); setImage(val.url); setVisible(true); }} showUploadList={{showRemoveIcon: false}}
2021-05-08 10:42:34
583
1
原创 百度地图API绘制点及提示信息
import React, { Component } from 'react';import { message } from 'antd';import './index.less';import httpClient, { RESPONSE_OK } from '../../service/httpClient';import apis from '../../service/config';class MapStyle extends Component { constructo
2021-04-27 12:02:52
440
1
原创 HTML中平方米、n次幂表示
平方米代码：m<sup>2</sup>如图：n次幂代码：x<sup>3</sup> + 2<sup>y</sup> + 3y = 13如图：无聊解一下，令y = 1，x = 2；
2021-04-27 11:43:21
1811
原创 HTML5画布canvas为页面加水印
utils.js/** * 水印 */export const waterMark = (userName) => { let canvas = document.createElement('canvas'); let ctx = canvas.getContext('2d'); canvas.setAttribute('width', '180'); canvas.setAttribute('height', '150'); ctx.globalAlpha = 0.1;
2021-04-15 11:31:45
473
原创 HTML5的SVG画个五角星
使用HTML5的SVG画个五角星，W3C SVG 五角星改的。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head>
2021-04-15 10:58:47
920
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人