- 博客(211)
- 资源 (31)
- 问答 (1)
- 收藏
- 关注
原创 深入 Pinia:从代码出发探索 Vue 状态管理的奥秘
在之前的方法中,Pinia 实例上存在一个use()方法是对自定义插件的支持,在这里我们需要对安装的插件进行处理,调用左右的插件函数,并给函数传入四个参数。// apply 全部插件console.log("插件安装:", extender);// 如果使用开发工具// 调用插件,并传入参数extender({store,pinia,});} else {// 这里将插件返回的属性合并到 store 中assign(store,extender({store,pinia,
2023-04-24 15:25:32 1599 1
原创 VUE数据侦测原理
一、VUE2中的实现方法1. 前言我们知道:数据驱动视图的关键点则在于我们如何知道数据发生了变化,只要知道数据在什么时候变了,那么问题就变得迎刃而解,我们只需在数据变化的时候去通知视图更新即可。要想知道数据什么时候被读取了或数据什么时候被改写了,其实不难,JS为我们提供了Object.defineProperty方法,通过该方法我们就可以轻松的知道数据在什么时候发生变化。2. Object.definePropetyES5 提供了 Object.defineProperty 方法,该方法可以在一个
2021-10-22 17:43:23 489 1
原创 configuration has an unknown property ‘jsonpFunction‘
配置webpack时的报错。在 webpack 4 中,多个 webpack 运行时可能会在同一个 HTML 页面上发生冲突,因为它们使用同一个全局变量进行代码块加载。为了解决这个问题,需要为 output.jsonpFunction 配置提供一个自定义的名称。Webpack 5 确实会从 package.json name 中自动推断出一个唯一的构建名称,并将其作为 output.uniqueName 的默认值。这个值用于使所有潜在的冲突的全局变量成为唯一。迁移: 由于 package.json中
2021-09-01 11:21:41 4676 2
原创 npm 报错 errno: ‘ENOENT‘
ENOENT 这个错误实际上是 Error NO ENTry(或 Error NO ENTity)的缩写。一般常见于目录错误或者找不到目录,检测你命令中的路径,比如你路径中含有 /public/projects , 那么你的文件夹至少要有 public 这个文件夹。...
2020-12-28 11:15:49 4271
原创 deno 快速上手 - Hello World 案例
1. 安装通过单行命令将 Deno 安装到系统中(国内加速)安装内容转载自 Deno 中文社区安装最新版:使用 Shell:curl -fsSL https://x.deno.js.cn/install.sh | sh使用 PowerShell:iwr https://x.deno.js.cn/install.ps1 -useb | iex安装某个特定版本:使用 Shell:curl -fsSL https://x.deno.js.cn/install.sh | sh -s v1
2020-11-09 14:08:05 498
原创 uiautomatorviewer 提示 Error obtaining UI hierarchy 的解决办法
很多小伙伴使用 uiautomatorviewer 都不是用的原版的,而是用的这个带二维码的魔改版,因为这个可以直接获取到比较准确的 xpath,省去了很多麻烦。原版的当然对大部分应用的支持性都比较好,而这个二维码版的我们经常会遇到 Error obtaining UI hierarchy 这个错误,在网上看了很多的解决办法都不是很管用,在此,有个万能的用法,减少新手学习成本。解决方法:下载 uiautomatorviewer自动截图.bat 脚本下载完上边的脚本后双击打开,脚本会自动完成截图并
2020-11-07 10:27:52 4009 1
原创 ⚡vite 打包资源路径不对页面不显示
vite打包内部采用的是Rollup完成的应用打包,因为vite高度依赖ES Modules特性所以只支持现代浏览器,抛弃IE市场,如果你需要兼容IE需要另做处理,详情可以参考这里。你只需要在终端执行 npm run build 打包过程轻松又愉快,先不要高兴的太早,这时候如果你打开 dist 文件下的打包文件会发现页面显示不出来,一拍脑门想起来在 vue.config.js 里面配置一下 publicPath: './',不过当你做完这一切之后发现并没有解决问题,why?在这里先不要慌,只需要继续向下看
2020-11-05 13:57:31 16570 5
原创 快速上手 Vue3
1、Vue3的特点vue3中全部采用函数式写法,替换了原来类的写法。移除了原有的生命周期函数,和 data、computed、watch、method 等vue2中的对象,去掉了 this, 并且去除了过滤器 filter。vue3源码全部采用ts编写,编码中实现了对ts更好的支持。vue3完全兼容vue2,在vue3中依然可以按照vue2的方式去写代码,而且两种写法可以同时存在。组件中同时存在两种写法时,当setup返回值中定义的方法和methods中的方法同名时,会抛出错误。定义的数据和d
2020-11-03 20:46:27 318
原创 ant-design-pro 多环境请求代理配置
在开发中我们可能需要区分多种情况,比如开发环境,测试环境,语法环境,在 Pro 中我们可以通过的环境变量来实现这个需求。const serveUrlMap = { dev: 'https://dev.8jsj.cn/', pre: 'https://pre.8jsj.cn/', test: 'https://test.8jsj.cn/', idc: 'https://idc.8jsj.cn/',};const { SERVE_ENV = 'idc' } = process.env;
2020-11-03 11:01:24 1817
原创 Nuxt 中使用 viser.js
如果我们直接在 Nuxt 中使用传统的 import 导入 viser 的话,运行时会发现 window is not defined or document is not defined 的报错。因为使用到了 Nuxt 的服务端渲染,而在服务端是没有 window 和 document 的,所以会报这个错。 window 和 document 只存在于浏览器中。查阅一下 Nuxt 的官网有对应的解决方法,官网地址。这种方式的话并不是很友好,我认为比较好的方法是我们可以在 nuxt.config.
2020-10-23 17:25:07 385
原创 CST全国大学生软件测试大赛参赛记录分享
2020年2月10日更新:零基础的同学建议看一下这一篇:移动应用测试脚本编写案例Demo2019年11月6日更新:【题目下载】2019年CST全国大学生软件测试大赛试题下载,持续更新。【超详细】全国大学生软件测试大赛:移动应用测试脚本编写要求【超详细】全国大学生软件测试大赛:移动应用测试参赛指南前几天去南京参加了全国大学生软件测试大赛的总决赛,这里把参赛过程记录一下。全...
2020-10-11 23:03:55 16143 40
转载 【超详细】全国大学生软件测试大赛:移动应用测试参赛指南
博主提供练习题下载,导入eclipse即可运行。点击查看移动测试脚本编写要求:点击查看博主参赛纪录分享:点击查看本介绍分为以下几个部分:Appium配置 开发环境配置 插件更新指南 参加练习流程 其他参考文档...
2020-10-11 23:03:41 2815 5
转载 【超详细】全国大学生软件测试大赛:移动应用测试脚本编写要求
博主提供练习题下载,导入eclipse即可运行。点击查看移动测试脚本编写要求:点击查看博主参赛纪录分享:点击查看目录脚本编写要求UIAutomatorViewer 工具介绍1、获取快照2、页面层级3、属性详情定位控件的参数选择要求例1例2其他注意事项脚本编写要求UIAutomatorViewer 工具介绍在你开始写测试用例之前,使用 ui...
2020-10-11 23:03:30 2833
原创 【题目下载】历届CST全国大学生软件测试大赛试题下载,持续更新。
之前写的前几年的参赛记录,也有一些经验分享,可以看一下:CST全国大学生软件测试大赛参赛记录分享【超详细】全国大学生软件测试大赛:移动应用测试参赛指南【超详细】全国大学生软件测试大赛:移动应用测试脚本编写要求https://download.csdn.net/user/qq_17497931/uploads重要提示:在线做题如遇到“考试已结束”的提示,直接修改地址中最后一项即可:...
2020-10-11 23:03:17 8890 2
原创 【比赛指南】全国大学生软件测试大赛众包测试比赛指南
赛前须知:在创建个人报告之前,需下载“需求文档”,了解测试需求; 尽量完善测试用例,有助于最后的评分; 填写Bug报告时,必须选择对应的三级页面标题(若无,选择“其他”),对于没有选择页面标题的Bug报告一律计“0分”处理;建议学生对相同Bug进行fork补充或点赞、点踩操作,若发现提交相同bug报告则后提交的重复Bug报告计“0分”处理; 本次比赛为手工测试,无须提交“测试脚本”。1...
2020-10-11 23:03:04 1465 1
原创 全国大学生软件测试大赛移动应用测试脚本编写案例Demo
案例1——汽车之家在eclipse里使用对应的考试(或练习)秘钥登录并下载题目之后,打开项目的Main.java文件,接下来将在test函数里编写测试脚本。下面我们将以汽车之家为例,讲解如何依据题目的测试需求来编写一个能获得高分的脚本。测试需求中第一条测试需求如下:首先要打开Uiautomator Viewer工具来获取我们要测试的控件的定位参数,该工具的介绍和具体使用参...
2020-10-11 23:02:53 5205 4
原创 尝鲜 Vue 3.0 组合式API
Vue 3.0 即将发布,我们已经可以尝试一些新版本中带来的新功能,比如 Composition-API 组合式API。如果你了解过 React 的 Hooks,那么当你看到组合式API时一定不会感到陌生。组合式API受到了 React Hooks 很大的启发。Vue 非常易于使用,并且有非常出色的 API,对于初学者来说配合官方文档很容易就可以理解 Vue 的语法。但在国内一些大型的项目可能不会首选 Vue 去开发,因为当组件越来越大的时候会变得很难维护,很难找到一个变量在哪被定义又是在哪被使用。Vue
2020-09-06 17:46:46 2188
原创 14行代码实现小程序全局变量监听
这几天帮我哥们写了个小程序,但哥们要求必须全原生,很久没有写过原生了,又遇到了当初学小程序时遇到过的问题,就是原生小程序没有全局状态管理,这就让我的开发过程很不愉快了。小程序是有一个全局变量 globalData ,我们在小程序内的任何地方拿到 globalData ,这就给了我们模拟状态管理的基础条件。但 globalData 有个致命缺点就是他不是响应式的,我们不知道它什么时候被修改,如果我们做一些异步操作修改了 globalData 我们也不能确定被修改的时间点,不能确定何时去取新值。灵光一闪,
2020-08-19 20:40:24 1664 9
原创 高级前端必会的300个知识点(1)
1. Vue 常用的修饰符.lazy:v-model 在每次 input 事件触发的时候都会去进行数据同步,添加 lazy 修饰符后就转变为 change 事件触发时再进行数据同步。.number:可以自动将用户输入的值转为数值类型.trim:可以自动过滤用户输入的守卫空白字符事件修饰符:.stop:阻止冒泡, event.stopPropagation() 或 cancelBubble.prevent:拦截默认事件,等同于 event.preventDefault().passive:
2020-08-13 14:11:21 1096
原创 ant-mobile TabBar 组件添加路由
感觉 ant-mobile 和 vant 相比要很不方便,很多功能需要我们自己去实现,团队的重心应该都在 ant-design 上,比如 TabBar 并没有设置路由功能,本文阐述了如何在一个使用了 react-router 的 react 项目中合理的使用 antd-mobile tabbar 功能。为了使组件结构更加清晰,首先要在 TabBar 组件外包一层父组件来读取路由信息,因为 TabBar 的内容在版本迭代中很少去改动,我们可以直接使用 switch 来设置当前页:switch (..
2020-08-12 23:24:53 1150
原创 react-router-dom 路由基础教程
一、安装yarn add react-router-dom根组件index.js使用 Router 组件包裹根节点来实现全局的路由访问。import{BrowserRouterasRouter}from'react-router-dom'<Router> <App/></Router>结构有 BrowserRouter 和 HashRouter 两种模式,分别对应 VUE-router 的 mode: history ...
2020-07-26 22:49:19 2762
翻译 HTTP/2 push 比我想象的要难
HTTP/2 Push 比我想象的要难一些关于页面加载性能问题,我经常听到 “这个用 HTTP/2 Push 可以解决啊” 这样的话,但是我对于 “HTTP/2 Push” 并不了解,所以我决定深入研究一下并写下这篇文章。HTTP/2 Push 比我最初想象的要复杂而且要低级一些,但真正让我措手不及的是浏览器之间对于 HTTPS/2 Push 兼容的的不一致,即使我认为这已经完成了我的工作并且已经完全可以投入生产。这不是对 HTTP/2 Push 这样的的恶意诽谤,我认为 HTTP/2 Push 非常
2020-07-26 14:40:14 575
原创 JavaScript 数组扁平化处理的方法总结
所谓“数组扁平化”就是指将一个多维数组变为一个一维数组,比如:[1, 2, [3, 4, [5, 6]] ==> [1, 2, 3, 4, 5, 6]我们通过几种常用方式来实现数组的扁平化。方法1:flat()法flat() 方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。语法:var newArray = arr.flat([depth])depth:可选,指定要提取嵌套数组的结构深度,默认值为 1。当depth值为 In
2020-06-28 15:32:21 559
翻译 「ReadingKoa」Day 1 — Koa中间件的运行原理
Koa中的中间件与Express的不同,Koa使用洋葱模型。 Koa的中间件仅包含四个文件,今天我们只看主要文件-application.js。 它已经包含了中间件如何工作的核心逻辑。准备工作git clone git@github.com:koajs/koa.gitnpm install我们在项目的根目录添加index.js进行测试:// index.js// Include the entry file of koaconst Koa = require('./lib/applica.
2020-06-27 21:30:19 206
原创 yarn 学习记录——常用命令
1、初始化环境yarn init -y2、换淘宝源yarn config set registry http://registry.npm.taobao.org3、安装依赖安装package.json本地 node_modules文件夹中列出的所有依赖项: yarn install安装一个依赖包:(yarn默认安装为本地依赖)yarn add [package]@[version]yarn add [package]@[tag]安装本地包:yarn add [package] --dev
2020-06-25 17:08:43 220
原创 事件监听的简单封装
var on = (function() { if (document.addEventListener) { return function(element, event, handler) { if (element && event && handler) { element.addEventListener(event, handler, false); } .
2020-06-23 22:26:47 354
原创 JavaScript数组去重方法总结
方法一、利用ES6 Set去重(ES6中最常用)function unique (arr) { return Array.from(new Set(arr))}var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];console.log(unique(arr))//[1, "true",
2020-06-12 09:21:53 214
原创 Fetch 请求的 GET 和 POST 封装
Fetch API提供了一个 JavaScript 接口,用于访问和操纵 HTTP 管道的一些具体部分,例如请求和响应。它还提供了一个全局fetch()方法,该方法提供了一种简单,合理的方式来跨网络异步获取资源。这种功能以前是使用XMLHttpRequest实现的。Fetch 提供了一个更理想的替代方案,可以很容易地被其他技术使用,例如Service Workers。Fetch 还提供了专门的逻辑空间来定义其他与 HTTP 相关的概念,例如 CORS 和 HTTP 的扩展。使用 F...
2020-06-09 22:08:44 1659
原创 NodeJS使用http模块实现服务器代理
main.jsconst http = require('http');const url = require('url');const path = require('path');const fs = require('fs');const qs = require('querystring');const { promisify } = require('util');const readFileAsync = promisify(fs.readFile);const proxy
2020-05-27 22:15:02 1027
原创 1分钟搞懂箭头函数this指向问题
在网上看到很多关于箭头函数this指向的博客和问题解答,但是基本写的都不准确,有的甚至是错误的,在其他博客网站得到的答案基本就是“箭头函数在定义时this指向谁那么之后就一直指向谁”,这句话虽然不错,但是这不还是没说清楚到底是指向了谁嘛。实在看不下去了,今天在这里详细写一写箭头函数的this到底指向谁?在这里首先看一看MDN对于箭头函数的介绍:箭头函数表达式的语法比函数表达式更简洁,并且没有...
2020-03-23 23:10:57 806 2
原创 KeyboardEvent.metaKey 苹果电脑command键按下、win键按下
KeyboardEvent.metaKey为只读属性,返回一个布尔值,在事件发生时,用于指示Meta键是按下状态(true),还是释放状态(false)。备注:在MAC键盘上,表示Command 键(⌘),在Windows键盘上,表示 Windows 键(⊞)。语法var metaKeyPressed = instanceOfKeyboardEvent.metaKe...
2020-03-23 20:32:46 1668
原创 原生JS实现 slice() 方法
定义和用法slice() 方法可从已有的数组中返回选定的元素。语法arrayObject.slice(start,end)实现Array.prototype.slice=function(start,end){ start=start===undefined?0:start; end=end===undefined?thi...
2020-03-21 20:35:16 974
原创 原生JS实现 some() 方法
定义和用法some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。some() 方法会依次执行数组的每个元素:如果有一个元素满足条件,则表达式返回true, 剩余的元素不会再执行检测。 如果没有满足条件的元素,则返回false。注意:some() 不会对空数组进行检测。注意:some() 不会改变原始数组。语法array.some(function(...
2020-03-03 23:12:12 1528 3
原创 原生JS实现 every() 方法
定义和用法every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。every() 方法使用指定函数检测数组中的所有元素:如果数组中检测到有一个元素不满足,则整个表达式返回false,且剩余的元素不会再进行检测。 如果所有元素都满足条件,则返回 true。注意:every() 不会对空数组进行检测。注意:every() 不会改变原始数组。语法...
2020-03-03 23:09:23 1525
原创 原生JS实现 fliter() 方法
定义和用法filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。注意:filter() 不会对空数组进行检测。注意:filter() 不会改变原始数组。语法array.filter(function(currentValue,index,arr), thisValue)参数说明参数 描述 function(curr...
2020-03-03 23:05:06 688
原创 JS实现数字字母混合验证码(数字+大写字母+小写字母)
我之前写了一篇《JS实现随机验证码》,可以产生随机数字、随机颜色、随机位置,但只能产生数字验证码,今天在此基础上进行改进,使之可以随机大写字母、小写字母、数字三种类型。思路我们使用Math.random()获得0~34的随机数,将0和10~33规定为字母,然后我们随机将字母改为大写字母。实现验证码的随机我们声明一个txt来存放我们获得的0~34的随机数。然后声明一个flag来标识我们...
2020-03-03 22:59:25 4343
原创 JS生成随机验证码
在网站中我们很常见到形形色色的验证码,今天我们来用JS来生成一个随机的二维码。我们需要用到canvas来进行验证码的绘制什么是CanvasHTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像。画布是一个矩形区域,您可以控制其每一像素。canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。点击学习思路我们要做的二维码首先要有随机的数字,其...
2020-02-29 20:58:13 2277
原创 JS判断一个日期是这一年的第几天
使用JS判断一个日期是这一年的第几天。首先我们先整理一下思路:假如是12月11日,那么我们需要将1-11月的天数加起来,然后加上12月的11天。 假如是1月9日,那么我们只需要将1月的这九天就可以了。那么这样的话首先我们可以使用if else去判断,但是用if else的话效率是很低的,这里我们可以使用switch的case穿透效果来优化代码:/** year :年份* ...
2020-02-25 22:23:33 6307 2
原创 高度塌陷的产生原因及解决方法
什么是高度塌陷?当父元素未设置高度时,所有子元素浮动后,造成子元素脱离文档流进而无法把父元素撑开,父元素高度为0产生高度塌陷,称为高度塌陷问题。父元素高度塌陷后,父元素以下的元素都会向上移动,导致布局混乱,所以我们要解决高度塌陷的问题。如下代码:<div class="box"> <div class="div1">div1</div>...
2020-02-23 17:23:53 9164 1
原创 CSS实现单行文本居中,多行文本居左
要实现的效果如上图所示,在一个容器内多行文字为靠左对齐,单行文字为居中对齐。HTML结构如下:<div class="box"> <p>多行文字内容多行文字内容多行文asdasd字sdfsdf123124容多行文字内容多行文字内容多行文字内容</p> <p>单行文字内容单行文字内容</p></div&...
2020-02-12 17:57:11 2752
uiautomatorviewer自动截图.bat
2020-11-07
vuejs_devtools_beta-6.0.0.1-chrome.zip
2020-11-03
【CleverPDF】PDF转换器
2020-06-28
【大学生软件测试大赛】移动应用测试高分脚本
2019-10-27
layui 后台模板vip-admin版HTML5
2018-07-13
slk转wav格式软件slk2wma免费下载
2018-07-05
spring-framework-5.0.6.RELEASE-dist.zip
2018-05-14
javax.jar 包免费下载
2017-09-10
burpsuite_pro_v1.7.11
2017-08-13
微信公众平台接口调试工具可以请求成功,微信显示出现故障!
2018-07-05
TA创建的收藏夹 TA关注的收藏夹
TA关注的人