前端
文章平均质量分 77
Yoyo_Yan
这个作者很懒,什么都没留下…
展开
-
微前端qiankun从头写一个demo,包含主微应用、微微应用通信用例
文章目录qiankun 微前端 demo 说明1. 路由说明:1.1 hash 路由:1.2 history 路由:路由切换2. LifeCycles:3. 父子通讯3.1主应用与微应用的通信3.2微应用之间的通信3. 手动加载微应用4. css隔离5. js隔离Trouble Shootingqiankun 微前端 demo 说明demo传送门 启动:$ npm start项目文件说明见 ProjectTree.md。通过npm-run-all包启动所有应用,主应用 main-app 采用动原创 2021-08-17 17:00:08 · 1543 阅读 · 0 评论 -
面试整理 - JS篇(一)
文章目录JS值类型 vs 引用类型typeof可以判断哪些类型深拷贝强制类型转换原型和继承instanceof判断属于哪个构造函数/class手写简易的jQuery考虑插件和扩展性作用域和闭包闭包两种场景:this几种场景:手写bind闭包的应用异步和单线程同步和异步的区别手写promise加载图片异步进阶event loop(事件循环/事件轮询)promise进阶async/await微任务/宏任务JS值类型 vs 引用类型队列 FIFO,堆栈 FILO内存地址分布如下:栈在上,堆在下,一般原创 2021-01-22 22:17:40 · 396 阅读 · 0 评论 -
React 执行setState、updateState后,组件不更新,通过深拷贝解决
在更新数据时,尤其是引用数据类型的数据,如:数组、对象等。直接更新原数据后不会触发render。例如:如果直接将props中的数据解构出来进行修改,修改后直接更新状态,会出现组件不更新的情况。可以考虑如下写法:先将解构出来的数据神拷贝后,在进行操作。// import deepClone from 'xxxxxx';onSave=()=>{ let { gridList } = this.props; let _list = deepClone(gridList); ... //原创 2021-02-24 14:24:35 · 1888 阅读 · 0 评论 -
面试整理 - JS篇(二)
JSAjax核心API手写ajaxconst xhr = new XMLHttpRequest();// get请求xhr.open("GET", "/data.json", true); // true表示异步// 状态改变时xhr.onreadystatechange = function () { if (xhr.readyState === 4) { if (xhr.status === 200) { alert(xhr.responseText);原创 2021-01-24 09:44:17 · 243 阅读 · 0 评论 -
Handsontable 表头的合并、导出、小计合计等设置,内含github实例以及包连接
背景:vue项目中使用了handsontable做报表,表格比较复杂。后端返回表格数据,在前端整理成handsontable需要的数据格式后展示。涉及到了查询、根绝查询结果动态渲染表头、导出等功能。因为当时搞了好久,所以这里详细记录下遇到的问题。写了一个handsontable的小demo放在github上了 【传送门】,包含以上功能,项目启动后的访问地址:http://localhost:8080/#/hotTableComp。handson介绍handsontable引用方式:cdn or原创 2020-08-25 13:58:12 · 6329 阅读 · 2 评论 -
一次服务器部署的Linux命令整理
最近做app需要将打好的包部署到客户环境,学习了一下,做个记录。常用命令如下rz =>上传本地文件unzip + 文件全名称 => 解压.zip文件rm -rf 文件名称 => 删除当前目录下的所有文件docker ps => 查看docker运行中的容器docker stop 容器名称 => 停容器docker start 容器名称 => 启动容器ls => 查看目录下文件ll => 查原创 2020-08-22 12:15:08 · 208 阅读 · 0 评论 -
点击按钮,在input框在光标位置插入文字,系列问题待解决
想制作一个公式设计器,需要在文字的对应位置插入按钮对应的文字,效果如下:遇到的问题:1. 如何获取光标位置,并在对应位置插入内容两种情况:(1)用户点击位置后,在光标位置插入内容(2)用户选中几个字之后点击按钮进行文字替换解决:selectionStart和selectionEnd可以获取到当前元素光标的起始位置。 //对应光标位置插入文字 insert(val) ...原创 2020-03-01 21:11:05 · 2654 阅读 · 2 评论 -
window.scrollTo滚动
window.scrollTo()和window.scroll()是同一个方法,参考MDN。window.scrollTo()在window对象上实现滚动效果//可以直接调用window.scrollTo(0, 1000);//也可以加window.scrollTo({ top: 100, left: 100, behavior: 'smooth'});在具体的元素...原创 2020-02-09 22:11:40 · 2900 阅读 · 1 评论 -
浏览器报错信息整理及解决方案
Uncaught ReferenceError: methods is not defined由于是工程化项目,只要有一个vue页面有问题,即使路由到别的页面也会报错,导致整个工程不可用。 methods is not defined:(报错如图) 选择source,查看报错文件,发现有method没有写完: ...原创 2018-07-23 12:35:11 · 2668 阅读 · 0 评论 -
vue的一些易混淆事件整理 - @change | trigger: 'blur' |
部分总结参考 简书 HTML DOM事件(一) onchange onpropertychange 和 oninput 事件的区别1、onchange 事件与 onpropertychange 事件的区别: onchange 事件在内容改变(两次内容有可能还是相等的)且失去焦点时触发。 onpropertychange 事件却是实时触发,即每增加或删除一个字符就会触发,...原创 2018-07-23 15:09:29 · 30363 阅读 · 3 评论 -
初次新建一个vue项目
安装node.js和npm(npm依赖于node.js所以要先安装node)安装完成后打开cmd 输入 node -v 输入 npm -v 可以看到版本号表示安装成功开始在cmd中新建项目:(1)安装脚手架工具: npm install -g vue-cli –registry=https://registry.npm.taobao.org (—淘宝镜像比较快)(2)安装完成...原创 2018-07-12 14:52:24 · 285 阅读 · 0 评论 -
vue 配置路由(router-vue)
配置路由vue项目运行时首先找到main.js文件,通过main.js文件中的el找到App.vue:new Vue({ el: '#app', router, components: { App }, template: '<App/>'})要往index.js文件中import进来一个目标文件,例如我需要给test.vue文件加一个路由,那么我首...原创 2018-07-18 14:51:04 · 451 阅读 · 0 评论 -
vue各模块功能范围,webpack属性配置
app.js 项目的入口模块,一切的请求o都要先进入这里进行处理。调用router.js进行路由分发处理。 router.js 只负责分发路由,不负责业务逻辑处理。调用controller进行业务逻辑处理。 controller 只负责处理业务,不负责处理数据的CRUD。调用model层处理数据的CRUD。 model层 ...原创 2018-07-31 16:29:43 · 1060 阅读 · 0 评论 -
重要的鸡毛蒜皮
持续更新……问题一: 关于右键浏览器的“检查”有哪些看点?对于一些函数是自带参数的,例如一些绑定的事件,接收到的参数是scope 应该是scope对象,此时在函数里操作scope的属性如何查看和调用呢? 例如 组件如下: 先写出函数和接收的参数scope,然后console.log(scope); 将scope打印出来,如下:handleUpClick(scope){ ...原创 2018-08-08 19:50:53 · 281 阅读 · 0 评论 -
GoJS去水印, v1.7 v1.8.29 两个go.js版本
GoJS 去水印只需注释掉以下部分GoJS v1.7 无水印版本GoJS v1.8.29只需注释掉以下部分在go.js文件中将这个方法中的代码注释掉即可 w.om = function() { var a = window.document.createElement("canvas"), b = a.getContext("2d"); /...原创 2018-09-18 16:23:57 · 1317 阅读 · 1 评论 -
正则表达式
g i mg - 全局匹配i - 大小写不区分m -^ $^ - 表示开始$ - 表示结束整个正则表达式写在/ /中例子手机号/^1[34578][0-9]{9}$/色值(十六进制)var color = /^#[0-9a-fA-F]{6}/日期/^\d{4}[/-]\d{2}[/-]\d{2}$/...原创 2018-12-27 15:18:31 · 156 阅读 · 0 评论 -
前端等工具安装以及一些依赖
首先安装VSCode,我安装了一下插件: 下面是在安装好VSCode之后,如果发现找不到git的情况,需要重新配置一下git的path:安装npm依赖时(首先要安装node.js,因为npm依赖于node.js),先去淘宝镜像里(https://npm.taobao.org/)找到:$ npm install -g cnpm --registry=https://regi...原创 2018-07-11 16:59:18 · 967 阅读 · 0 评论