- 博客(50)
- 收藏
- 关注
RSS订阅转载 react中的keep-alive功能
在vue中可以很方便的实现keep-alive功能，但是在react中却不是很方便，遇事不要慌，度娘来帮忙。react-keep-alive首先找到的是react-keep-alive，一波操作之后，发现原来显示的页面不显示了，唉，抬下去，下一个！react-activation这个真香，具体怎么使用不再介绍，请查看中文文档，使用的时候要认真查看文档，同一个父节点下，相同位置的 <KeepAlive> 默认会使用同一份缓存，要想实现多份需要增加动态id属性来区分。手动控制缓存（tabBa
2021-09-17 21:50:15
2260
2
转载 前端搭建环境
nvmnvm-windowsDownload the latest installermaccurl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh | bashwget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh | bashexport NVM_DIR="$([ -z "${XDG_CONFIG_HO
2021-09-04 21:45:37
210
原创 奇技淫巧之一
取整const integerN = 0|3.2;数组过滤false数据const newArr = [2, '', undefined, 'a', false, null].filter(Bolean)ThinkPad的笔记本用出苹果笔记本感觉第一步联想官方驱动下载地址：https://iknow.lenovo.com.cn/driver/driverlist输入型号ThinkPad E570c（根据自己笔记本型号输入）第二步找到触摸板驱动下载安装即可，安装完了之后，进入 开始》设置
2021-09-04 21:43:50
253
转载 通过CSS控制svg变化
本文介绍使用css魔法控制svg变化，要想实现这一点只需要耐心看下去！svg代码示例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initi
2021-07-28 22:56:19
1226
原创 xampp问题
使用xampp（v3.3.0）无法启动MySQL端口号被占用It seems that the port 3306 is already in use.aer you sure you want to use this port?因为安装xampp之前已经安装过MySQL，并且自动启动，默认端口号3306方法一：选择mysql->config->my.ini把3306端口都修改，Apache->Config->php.ini把3306端口也修改掉，控制面板->服务
2021-06-20 15:18:28
239
转载 开始工作就差一个双击
背景程序员日常，每天打开电脑开始工作时候总是要打开一堆的东西，浏览器、聊天工具、编辑器（打开对应的项目）、项目文件夹…作为一个’懒人‘，每天重复这一堆操作，很烦~~~环境windows（MAC也可以，下文会讲一点）gitVSCode安装并配置了path开整第一步新建文件新建一个文本文档，重命名为open.sh，重点是后缀，双击打开此文件会默认使用git bash运行后缀名也可以是.cmd双击打开此文件会默认使用cmd运行第二步编写文件想要打开一个文件夹（文件夹地址：E:\proje
2021-06-20 00:05:12
157
转载 一步一步打造属于自己的脚手架
预备知识本地安装卸载包在项目根目录下运行下面命令# 安装npm link# 卸载npm unlink命令行命令指定运行文件package.json文件中bin字段指定项目依赖包chalk 打印出彩色字commander 完整的 node.js 命令行解决方案download-git-repo 下载仓库代码handlebars 编译文件inquirer 交互式命令行界面ora 加载动画update-notifier 更新通知fi
2021-06-05 23:43:34
202
原创 微前端-多页应用
简介多页应用初级实现方案，技术栈包括elementUI、vue、vuex、axios。。。解决问题项目布局共用问题使用iframe嵌套子页面的方式，只会更新页面部分区域跳转子页面只更新部分区域使用iframe嵌套子页面的方式子页面提示不置顶受到iframe限制，封装方法采用调用主页面vue实例提示子页面控制跳转到主页面路由采用调用主页面vue实例跳转（主页面实例挂载在window上）直接进入子页面自动跳转主页面中对应路由封装方法判断是否被嵌入iframe，
2021-05-21 23:45:33
598
转载 前端脚手架项目
安装npm install @lydxwj/da-cli -g开发git clone https://github.com/lydxwj/da-cli.git# 或者下载解压https://github.com/lydxwj/da-cli/archive/refs/heads/master.zipcd ./da-clinpm install# 安装完依赖之后执行npm link命令打开命令行工具增加模板da add步骤示例：(本项目地址https://github.
2021-05-21 23:28:58
161
转载 自动生成文档
批量把Markdown文件转化成HTML，并且支持浏览器预览，实时更新同步修改开发npm start自动打开浏览器监听文件变化出现谷歌打开开发者工具之后操作页面卡死时，建议升级浏览器生产npm run build介绍目录结构asserts：存放静态文件style：本文件夹中的github-markdown.css文件是样式必需文件build：打包执行的相关代码dist：生成文档目录src：Markdown文件目录template：HTML模板文件目录注：
2021-03-22 23:40:51
273
转载 failed with status 128
报错信息# 在使用`download-git-repo`下载仓库代码时报错信息'git clone' failed with status 128Response code 404 (Not Found)connect ETIMEDOUT# 运行`git clone`的报错信息remote: HTTP Basic: Access deniedfatal: Authentication failed for处理download-git-repo报错Response code 404 (
2021-03-21 16:07:36
2453
原创 gitignore不生效
问题修改.gitignore文件之后，git commit提交，但是没有生效最新的gitignore配置解决出现不生效的原因是已经提交过更新，git有了缓存，所以更改完.gitignore文件需要先清git缓存，然后再提交git rm -r --cached .git add . git commit -m 'xxx'...
2021-03-21 16:06:31
161
原创 element表格多选和单选、选中高亮处理、保存多页选中记录和翻页回显选中
环境：element-ui@2.13.2vue@2.6.6示例：1. 表格单选方案1<template><div class="radio_page"> <div class="selected_num">已选 {{selectedRow.name}}</div> <el-table :data="list" ref="table" :border="true" v-loading="
2021-01-27 22:06:48
381
转载 自定义指令函数传参
环境：vue@2.6.6问题：绑定函数传参传参多个多样参数动态变化方案：1. 采用传对象方式(binding.value)<el-button v-mydirective="{ fn: myFn, args: x }" type="text" size="small">测试</el-button>const mydirective = { inserted: function (el, binding) { const args = bindin
2021-01-27 22:03:13
1445
转载 小程序自动化
环境：miniprogram-automator@0.10.0jest@26.6.3问题：建议整个测试项目可以独立于小程序项目之外jest同步执行多个测试文件会出错，需要加参数--runInBand不分多个文件测试小程序automator.launch要执行多次，容易导致测试出现多种问题automator.launch无法在多个文件中共用变量引入其他文件导出方法传入it时，即使出错，测试也是通过的当测试点击按钮跳转时或者测试详情页面时，一定要注意判断条件按钮跳转
2021-01-24 21:26:09
510
原创 H5页面跳转小程序
环境：vue2.X公众号内问题：生成签名：config:invalid signature确认签名算法正确，可用 页面工具进行校验。确认config中nonceStr（js中驼峰标准大写S）, timestamp与用以签名中的对应noncestr, timestamp一致。确认url是页面完整的url(请在当前页面alert(location.href.split(’#’)[0])确认)，包括’http(s)????/‘部分，以及’？‘后面的GET参数部分,但不包括’#'hash后面
2020-12-21 23:52:40
892
1
原创 面试题-实现异步队列
实现异步队列实现异步队列函数，使其能够按照参数顺序依次输出function fun1(cb) { setTimeout(function() { console.log('fun1'); cb(); }, 3000)}function fun2(cb) { setTimeout(function() { console.log('fun2'); cb(); }, 1000)}function fun3(cb) { setTimeout(func
2020-12-21 23:44:07
218
原创 小程序使用socket.io
环境服务端：Eggegg2.15.1egg-socket.io4.1.6客户端：小程序问题1.小程序不支持socket.io推荐使用weapp.socket.io2.小程序端socket配置// weapp.socket.io项目打包后的文件const io = require('../static/js/weapp.socket.io');io(url, { transports: ['websocket'], // 此项必须设置});3.服务端配置Egg官方文档
2020-12-06 12:57:04
3838
1
转载 算法入门之二叉树遍历顺序
二叉树遍历顺序四种遍历方式先/前序遍历、中序遍历、后序遍历、层序遍历测试二叉树创建function BinaryTree() { this.root = null; this.insert = function (key) { var node = new BinaryNode(key); if (this.root) { this._insertNode(node, this.root); } else { this.root = new BinaryNode(key)
2020-11-24 23:49:36
411
转载 loadmap
地图SDK加载器，支持腾讯地图和百度地图，可用于vue和react项目。百度地图可选择使用react-baidu-maps，vue-baidu-map安装npm install load-map --save使用import LoadMap from 'load-map';LoadMap.load({ mapKey: 'xxxxx', // 你申请的key version： '2.exp', // 地图版本， url: 'https://map.qq.com/api
2020-11-03 21:30:07
1484
原创 装饰器报错
版本1.50.1（中文简体插件）报错内容对修饰器的实验支持功能在将来的版本中可能更改。在 “tsconfig” 或 “jsconfig” 中设置 “experimentalDecorators” 选项以删除此警告解决办法方法一：设置VSCode选项管理==>设置==>搜索experimentalDecorators==>打上勾勾方法二：增加jsconfig文件在根目录下新建jsconfig.json文件{ "experimentalDecorators": t
2020-11-03 21:26:22
715
原创 babel配置装饰器
版本@babel 7.X依赖安装npm install --save-dev @babel/plugin-proposal-decorators npm install --save-dev @babel/plugin-proposal-class-properties配置{ "plugins": [ ["@babel/plugin-proposal-decorators", { "legacy": true }], ["@babel/plugin-proposal-cla
2020-11-03 21:23:28
804
原创 npm无法登录、发布
报错内容npm ERR! network request to https://registry.npmjs.org/-/v1/login failed, reason: connect ETIMEDOUT 104.16.18.35:443npm ERR! network This is a problem related to network connectivity.npm ERR! network In most cases you are behind a proxy or have bad
2020-10-31 16:06:35
9424
2
原创 Egg代理文件上传
遇到这个需求时候，疯狂百度搜索浏览几篇博客之后，看到解决方案大致分为两种：代理上传流先接收文件并写入，再代理请求上传大多数文章都介绍的是第二种先接收文件并写入，再代理请求上传，这种方式无论是Egg自带的 HttpClient，还是superagent、request(已停止更新，不推荐使用)都是支持的。第一种代理上传流（单文件），目前只发现superagent支持（其他或许支持流，但需要先接收文件并写入）。接下来介绍解决方案。先接收文件并写入，再代理请求上传这种有很多种，本文只举例一个依赖安
2020-10-17 14:01:13
470
2
转载 Egg
搭建并开发初始化$ mkdir egg-example && cd egg-example$ npm init egg --type=simple$ npm i启动项目$ npm run dev$ open http://localhost:7001调试项目环境Chrome浏览器运行$ npm run debug配置运行npm run debug之后，谷歌开发者工具中会多出一个node标识点击进入，会打开一个DevTools-Node
2020-09-16 21:36:04
181
原创 Git代码迁库
背景项目开发初期使用个人建立git仓库，现需要迁移到部门git仓库实践为了不破坏原有的git提交记录，使用修改远程仓库地址的方式查看git remote // 查看远程仓库地址别名列表git remote -v // 查看远程仓库地址别名列表,并且显示push和fetch地址git remote show origin // 查看origin远程仓库的详细信息修改git remote origin set-url [url]// 删除之后添加git remote rm or
2020-09-16 21:11:54
137
原创 算法入门一
二叉树创建function BinaryTree() { this.root = null; this.insert = function (key) { var node = new BinaryNode(key); if (this.root) { this._insertNode(node, this.root); } else { this.root = new BinaryNode(key); }
2020-08-25 23:37:20
127
转载 ant-design-vue的兼容问题2
ant-design-vue的兼容问题2问题：ant-design-vue不兼容ie浏览器要求：ie兼容 >= 9环境：@vue/cli@4.5.4，ant-design-vue@1.6.4之前写了一篇博文解决ant-design-vue的兼容，由于@vue/cli搭建项目升级导致不能生效，为了解决这个遗憾，本片博文诞生第一步：安装依赖npm install --save-dev @babel/plugin-transform-runtimenpm install --save @b
2020-08-25 23:34:37
588
原创 element-ui表格问题
表格图片显示问题问题：表格中是用户信息，有用户头像，用户头像图片没显示，当两个用户头像地址一样，前一页还显示，下一页就没有了环境：elementUI2.10.1组件el-table el-avatarvue2.6.10解决：原因1：el-avatar组件内有一个isImageExist，默认情况下图片请求失败会把它设置为false，一旦设置为false，就不会再变成true，此时修改图片为正确地址也不会渲染图片。原因2：el-table表格更新，默认是会只更新变化部分，尽量减少dom操作。
2020-07-20 11:22:35
342
转载 element树形表格更新问题
环境：element-ui：2.13.2vue：2.6.6问题：新增，删除操作，表格不同步更新。表格数据懒加载，表格带有新增、新增子节点、编辑、删除、批量删除操作解析：表格每一行数据都有id和pid，pid用来标记当前行的父节点，hasChildren标识是否有子节点，children存放子节点的数组。更新节点的关键代码是this.$set(this.$refs.table.store.states.lazyTreeNodeMap, pid, nodes);，这一段代码很多文章可以搜索到，但是没
2020-07-03 15:27:27
1249
4
原创 优雅处理头像加载失败
环境：vue2.6.6element-ui2.13.2问题：用户头像图片加载失败，显示异常难看，难看的失败图标。解决：使用element-ui的Avatar组件<template> <el-avatar :src="photoUrl" size="small"> {{ name.substring(0,1) }} </el-avatar></template><script>export default {
2020-07-03 15:25:25
2121
原创 uni-app新入手踩坑
运行项目必备（微信小程序为例）小程序安装路径配置插件安装包安装微信开发者工具服务端口小程序安装路径配置运行=>运行到小程序模拟器=>运行设置=>微信开发者工具路径=>填写或者浏览选择插件安装工具=>插件安装=>选择需要的插件（编译scss等）插件市场包安装项目中如果有package.json文件需要安装里面所需要的包微信开发者工具服务端口微信开发者工具=>设置=>安全设置=>服务端口=>开启项目运行或者打包文件路径
2020-06-07 13:57:55
318
转载 vsc代码片段
如何新建文件=>首选项=>用户片段=>选择对应的语言或者新建全局代码片段文件ctrl +shift + p=>snippet=>插入片段=>选择对应的语言或者新建全局代码片段文件注意：新建一定要选择好对应的语言，否则会不生效示例文件快速生成typescript的vue组件代码vue.json{ "Print to typescript": { "prefix": "vue-ts", "body": [ "<template>\r
2020-06-07 13:26:03
472
原创 打印页边距问题
问题：打印功能(打印页面)，预览界面第二页顶部没有间距问题代码：<style type="text/css" media="print">@page { size: auto; margin: 0mm;}.print-page {/* 页面盒子样式类 */ position: absolute; width: 1000px; left: 0; top: 0; bottom: 0; padding: 40px 50px
2020-06-03 22:59:25
1826
转载 antdv国际化报错
报错内容Warning: [antdv: LocaleProvider] LocaleProvider is deprecated. Please use locale with ConfigProvider instead升级ant-design-vue到1.6.0版本，控制台报错(之前版本1.3.10)错误代码<template> <a-locale-provider :locale="locale"> <div class="home">
2020-05-25 15:20:49
722
原创 css实现箭头
边框箭头.arrow1{ position: relative;}.arrow1::after{ content: ''; position: absolute; left: 50%; top: 50%; height: 12px; width: 12px; transform-origin: 25% 25%; border-width: 2px 0 0 2px; border-color: #999; borde
2020-05-11 11:51:18
424
原创 年龄计算
年龄计算得出周岁，不精确算出月日，即只显示几岁/** * 根据生日得到年龄 * @param {String | Date | Number} [birthday] 生日 * @returns {Number} */function getAgeByBirth(birthday){ let age; const nowDate = new Date(); const birthD...
2020-04-20 14:46:16
1774
原创 二维数组排列组合
问题：二维数组分别叫父数组和子数组，父数组的长度和子数组的长度不确定，需要列出所有的组合（每一个组合的长度等于父数组的长度，即每个子数组中取一项进行组合）分析：由于父数组的长度和子数组的长度不确定，造成问题难度变大。组合会有很多种，因此把所有组合放在一个数组里好处理。每一个组合里面有多项，也适合使用数组。所有最终结果也用一个二维数组表示。这个问题要分两种情况讨论，一种二维数组父数组长度是1时...
2020-04-09 11:50:44
981
转载 样式变量共用于js或者template
环境vue cli4项目stylus (如果使用sass、less，可以类比)步骤创建stylus的变量文件variable.styl$mainBg = rgba(0, 21, 42, 1);$mainWidth = 210px;// 导出变量用于js:export { mainBg: $mainBg; mainWidth: $mainWidth;}j...
2020-03-10 23:20:23
208
转载 router跳转两次
环境：vue cli3项目问题：路由的参数没有，导致页面报错，实际是路由跳转两次，第一次有参数，第二次没有分析：既然跳转了两次首先应该想发起路由跳转的事件里面是否出现重复的this.$router.push，查看一番并没有，于是想到全局的路由守卫中或许出现重复跳转，结果发现还是没有，结果只能打断点调试查看，发现路由跳转的事件没有执行两次，但是路由守卫执行了两次，这说明肯定有地方多调用...
2020-03-10 23:19:14
4241
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人