weixin_40977578的博客

转载 详解keep-alive + vuex 让缓存的页面灵活起来

引入在使用vue + vue-router开发SPA的时候，有没有遇到过这样的情况：当我们在列表页和详情页之间切换的时候，如果列表页不做缓存，会导致每次从详情页返回时，列表页都会重新加载。如下图：细心的朋友已经发现了，当从详情页返回列表页的时候，列表页重载了，这样的体验显然不好，这时我们可以对列表页进行缓存处理。keep-alive实现页面缓存我们的项目不一定所有页面都需要做缓存处理，所以这里介绍两种按需缓存的方法：方法一：首先在定义路由的时候配置 meta 字段，自定义一个Ke

转载 nodejs的版本管理工具（nvm)

nodejs的版本管理工具（nvm)1.nvm是什么?nvm全名node.js version management，顾名思义是一个nodejs的版本管理工具。为了解决node各种版本存在不兼容现象,nvm是让你在同一台机器上安装和切换不同版本的node的工具，通过它可以安装和切换不同版本的nodejs。2.下载安装(win)可在点此在github上下载最新版本,本次下载安装的是windows版本。Releases · coreybutler/nvm-windows · Git.

原创 h5页面转PDF下载（包括pc端和移动端）

前情：需要在app内嵌的weixin项目将页面转成PDF并下载。使用技术：html2canvas插件 + jspdf插件实现思路：1）将h5页面用canvas画成图片 2）利用jspdf将图片插入pdf文件并下载缺点：生成的pdf是由图片拼接而成的，不能实现复制实现版本： 第一版：将h5页面转成一张长图，再根据A4值的高度将长图截成多个页面 缺点：使用起来不灵活。没办法在每个页面上插入页眉页脚 实现代码...

转载 微信X5内核调试

准备工作：Chrome浏览器，安卓手机，数据线，梯子一、在Chrome地址栏中输入chrome://inspect ，出现以下界面：二、手机微信端打开http://debugx5.qq.com,会出现以下几种情况：①：若出现无法打开debugx5！（debug5页面仅在使用了X5内核时有效,由于当前没有使用X5内核,无法打开 debug5!尝试进入 Debug tbs安装或打开Ⅹ5内核），则点击进入 Debug tbs安装或打开Ⅹ5内核 ，进入后出现如下界面：点击“安装线..

转载 小程序中的复制功能、H5页面中的复制功能（uni-app框架实现）

（1）小程序中的复制功能（h5页面中不支持，微信开发者工具中支持）官方文档地址：https://uniapp.dcloud.io/api/system/clipboard?id=setclipboarddata//复制文本内容copyCenter(){ console.log('复制内容~~'); let address = '11111fdshf返回的是科技孵化的思考和反抗集散地和' //设置系统剪贴板的内容 提示：API `setClipboardData` is not y

原创 react项目第六天(地图找房页面 ) 和 单个字母以及多个字母比较大小

拓展：单个字母以及多个字母比较大小一：单个字母二、多个字母

原创 var a = {n: 1}； var b = a； a.x = a = {n: 2}； console.log(a.x) console.log(b.x)

var a = {n: 1};var b = a;a.x = a = {n: 2};console.log(a.x) //undefined console.log(b.x) //{n: 2}解释：var b = a; 对象存贮在堆内存，a和b同时引用 {n:2}赋值操作为从左到右操作，但是 . 的优先级要高于 =所以先执行a.x，此时a和b的共同索引为{n:2；x:undefined}然后执行a = {n:2},a的引用改变，指向了新对象{n：2},而b依然指向的...

转载 js 中判断对象中是否有某个属性 keys hasOwnProperty和in的区别

原创 react路由高阶组件withRouter和属性校验prop-types

一、高阶路由：二、属性校验PropType导出一系列验证器，这些验证器可以用来确保接收到的数据是有效的。在验证属性之前，要先安装一个propTypes库，执行npm i -S prop-types 使用之前要先引入prop-type 验证属性前要先定义好一个对象，添加属性验证 不要忘了将定义好的对象挂载在组件上面我们可以设定一个属性是一个特定的js类型，默认情况下，下面的这些都是可选的 PropTypes.array, PropTypes.bool, PropTypes.f

原创 react笔记07(异步 action)

（补充）1、模拟axios请求2、react网站

原创 react笔记06(react-redux：https://react-redux.js.org、react-redux整个方案 优化)

原创 react笔记05(路由，redux: https://redux.js.org/introduction/getting-started)

补充：redux的dispatch 和 subscribe 解释dispatch：派发，通知仓库修改数据subscribe：订阅，仓库数据改变主动向调用的组件触发

原创 react笔记04(生命周期函数shouldComponentUpdate、高性能组件、jsx标签、jsx中写样式、React路由)

12

原创 react笔记03(事件传递参数、受控表单和非受控表单、组件传值、生命周期)

原创 react笔记02(组件的创建、状态和属性、事件、this指向复习)

原创 react笔记01(脚手架创建项目、熟悉目录结构、jsx的语法)

原创 ElementUi表格实现单元格内容显示固定字数且超出省略号显示

...<el-table-column prop="yiqibianhao" //内容 label="编号" //标题 width="110" //宽度 :formatter="stateFormat"> //格式化内容</el-table-column>......methods:{ stateFormat(row, c...

原创 监听全局变量的改变

一、场景：微信小程序首页页面渲染快，wx.login执行慢，导致首页中变量不是最新的app.jswatch: function (method) { var obj = this.globalData Object.defineProperty(obj, 'IsAuthorization', { configurable: true, enumerable: true, set: function (value) { this._

原创 时间转换（已使用时间计时&&秒转时分秒格式）

一、时间戳转时分秒// 计算已使用时间 jishiqi() { let kaishishijian = new Date('2020-10-22 12:00:00').getTime() //--改变 this.useTime = this.formatDuring(new Date().getTime() - kaishishijian) let that = this this.timeId = setInterval(() => {...

原创 使用mescroll-uni插件实现上拉加载和下拉刷新

1、首先将到uni-app插件市场下载mescroll-unihttps://ext.dcloud.net.cn/plugin?id=343或者去mescroll官网下载http://www.mescroll.com/load.html?v=190725/2、将下载到的（mescroll-uni目录）复制到自己的项目中components目录下3、在全局 / 页面中引入插件全局引入：main.js文件import MescrollUni from '@/components/mes...

原创 uni-app使用图片裁剪插件image-cropper

官网地址：https://github.com/wx-plugin/image-cropper官方完整demo地址：https://github.com/wx-plugin/image-cropper-demo一、背景：二、初始准备1、在项目中新建wxcomponents的文件夹，将官网下载下来的image-cropper插件文件夹粘贴进去2、pages.json文件中添加image-cropper（哪个页面需要用到就添加到哪个页面下）"usingComponents"

原创 图片转base64格式

转换：使用base64格式在线转换工具使用：background:url('data:image/jpeg;base64,/......)

原创 Promise和Async await讲解

转载 相对路径和绝对路径的区别

在HTML里只要涉及文件的地方(如超级链接、图片等)就会涉及绝对路径与相对路径的概念。1.绝对路径 绝对路径是指文件在硬盘上真正存在的路径。例如“bg.jpg”这个图片是存放在硬盘的“E:\book\网页布局代码\第2章”目录下，那么 “bg.jpg”这个图片的绝对路径就是“E:\book\网页布\代码\第2章\bg.jpg"。那么如果要使用绝对路径指定网页的背景图片就应该使用 以下语句：<body backround="E:\book\网页布局\代码\第2章\bg.jpg"...

原创 Vue中如何实现为单独页面设置背景色

下面我就为大家分享一篇Vue-cli中为单独页面设置背景色的实现方法，具有很好的参考价值，希望对大家有所帮助。例子： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 <template> <p class="finish-wrap"> <p class="fi...

转载 怎样修改element-ui中的样式？

方法一方法二使用 /deep/ .homePage /deep/ .el-main {　　padding: 0;　　} .homePage为我们要修改组件类名的父级组件样式类名。。即使定义一个空的类名也没事。 .el-main为我们要修改组件的样式。 或者 /deep/ .el-form-item__content{ margin-left: 140px !important; }...

转载 Css 实现漂亮弧形

在实现页面五花八门的有特色的ui时，我们有时会遇到要用实现一个弧形，而这样的弧形要怎么实现呢？用图片？好像不大现实，因为这样就要无故多加载一张图片了，这里我们来说说怎么用css的after伪类来实现弧形。先是一写元素，再给这个元素设置样式和伪类样式<view class="pure_top"></view>比如说这个pure_top元素(因为这里是小程序所以用的是view，h5也是一样实现的啦)，我设置的样式如下:.pure_top { width: ..

转载 vue移动端长按事件实现的几种方法总结

在vue中长按事件并没有封装，在使用的时候需要我们自己取写一个方法获取长按事件。方法一：使用@touchstart，@touchend，start (){clearTimeout(this.loop);//再次清空定时器，防止重复注册定时器this.loop=setTimeout(()=>{ console.log("长按了");},1000);},end (){clearTim...

转载 nodemon无法启动的解决方案

安装好nodemon后，启动服务器时出现以下情况：解决方案：管理员身份打开powershell 输入set-executionpolicy remotesigned出现下图选择A全是。再重新使用nodemon打开服务器，成功！

转载 H5新增的标签小结

常用的新标签 <header>页面的头部</header> <nav>语义：导航条</nav> <article>语义：文章</article> <section>语义：部分 区块 </section> <aside>语义：定义侧边栏</aside> <footer>语义：页面的底部</footer&g.

转载 细说浏览器输入URL后发生了什么

本文摘要：1.DNS域名解析；2.建立TCP连接；3.发送HTTP请求；4.服务器处理请求；5.返回响应结果；6.关闭TCP连接；7.浏览器解析HTML；8.浏览器布局渲染；总结当我们在浏览器输入网址并回车后，一切从这里开始。一、DNS域名解析我们在浏览器输入网址，其实就是要向服务器请求我们想要的页面内容，所有浏览器首先要确认的是域名所对应的服务器在哪里。将域名解析成对应的服务器IP地址这项工作，是由DNS服务器来完成的。客户端收到你输入的域名地址后，它首先去找本地的h

原创 []+{} 和 {} + [] 的结果是什么

valueof和toStringvalueOf()会把数据类型转换成原始类型，也就是说原来是什么类型，转换后还是什么类型，日期类型除外toString()会把数据类型转换成string类型，也就是说不管原来是什么类型，转换后一律是string类型[]+{} 和 {} + [] 的结果是什么[]+{} ，因为[]+{}为一个运算表达式，所以这里{}是作为一个空对象来解析的，空对象与空数组使用加号运算，实际是一个字符串连接操作，即[].toString() + {}.toSting()

转载 JavaScript同步执行、异步执行及异步事件队列中的执行顺序

首先明确两点：1.JS 执行机制是单线程。2.JS的Event loop是JS的执行机制，深入了解Event loop，就等于深入了解JS引擎的执行。单线程执行带来什么问题？在JS执行中都是单线程执行，所以代码的执行可以说是自上而下，如果前一段的代码出现问题，就会导致下一段代码无法执行，对于用户而言就是卡死现象，所以在JS执行机制引出了异步执行操作。那异步能解决什么呢问题，又会带来什么问题？异步操作能够很好的解决上面单线程执行出现的卡死现象，但是也会产生问题，比如同时对一件事情操作，

转载 进程与线程的一个简单解释

进程与线程的一个简单解释进程（process）和线程（thread）是操作系统的基本概念，但是它们比较抽象，不容易掌握。最近，我读到一篇材料，发现有一个很好的类比，可以把它们解释地清晰易懂。1.计算机的核心是CPU，它承担了所有的计算任务。它就像一座工厂，时刻在运行。2.假定工厂的电力有限，一次只能供给一个车间使用。也就是说，一个车间开工的时候，其他车间都必须停工。...

原创 Selenium+python常用命令及断言

Selenium+python一、常用命令1、open（URL）命令 1、作用：打开指定的URL，URL或者为相对或是绝对的URL 2、target：要打开的URL，value值为空；当target为空的时候，将要打开baseURL中填写的页面；当target不为空且值为相对路径，将打开baseURL+target页面，如，假设baseURL为：https://home.cnblogs...

原创 软件测试顶岗实习实习总结

实习总结一、实习单位 我现在在广东种子力量教育科技有限公司实习，职业是web测试实习生。公司成立于2017年，是一家专为6-15岁的青少年提供合适优质的编程教育产品和服务，提供包括自主研发的PiPa积木图形化编程，CodeMonkey代码闯关式编程，Python，C++，NOIP/NOI等系统化课程，以“理论、观察、实践、假设、结论”的科学教育方法，旨在全面提升青少年的逻辑思...

转载 Postman 安装及使用入门教程

安装本文只是基于 Chrome 浏览器的扩展插件来进行的安装，并非单独应用程序。 首先，你要台电脑，其次，安装有 Chrome 浏览器，那你接着往下看吧。1. 官网安装（别看）打开官网，https://www.getpostman.com点击那个灰灰色的「Chrome App (Free)」按钮。正常情况会跳转到Chrome网上应用店界面，但是，由于，嗯，你懂的！你一般看到的是第...

转载 Postman入门教程

【基础篇】 Postman功能（https://www.getpostman.com/features） 主要用于模拟网络请求包 快速创建请求 回放、管理请求 快速设置网络代理 安装 下载地址：https://www.getpostman.com/ 直接安装，成功后在chorme的应用程序中会多出一个Postman 页面访问请求：www.baidu.c...