- 博客(83)
- 资源 (4)
- 收藏
- 关注
原创 《医院项目驻场半月记:从憧憬到反思的旅程》
当时听闻这个驻场任务时,周围的人都说会“很好玩”,仿佛这只是一次轻松的行程,有事还能找同事帮忙,于是我怀着激动的心情踏上征程,心中甚至涌起一种即将奔赴战场前线作战的豪迈感,我将自己视为士兵,把产品当作武器,而医院则是那充满未知的战场,医生护士们仿佛是处在对面阵营的“对手”。然而,抵达医院后,现实却给了我沉重一击。
2025-01-07 14:35:58
445
原创 【qiankun】主应用css隔离、js隔离、日常通信机制
qiankun是一个微前端框架,它提供了多种机制来确保主应用与子应用之间的独立性,包括CSS隔离、JS隔离以及日常通信等。
2024-11-28 16:40:02
837
原创 Lerna管理和发布同一源码仓库的多个js/ts包
综上所述,Lerna是一个功能强大、易于使用的JavaScript/TypeScript项目管理工具,它极大地简化了多包项目的管理和发布流程。无论是初创项目还是成熟的企业级应用,Lerna都能够提供强大的支撑。Lerna广泛应用于微前端、库的开发、大型单页应用(SPA)或企业级后端服务等领域。通过Lerna,开发者可以将复杂的项目结构清晰化,每个子模块都能独立发展和部署,而整体又能协调一致。Lerna允许开发者在同一个源码仓库中开发多个软件包,这些软件包可以相互依赖,但又保持独立。
2024-11-28 16:36:34
379
原创 前端框架主要做些什么工作
例如,通过减少HTTP请求、优化CSS和JavaScript、利用缓存机制、图片优化以及异步加载和按需加载等方式,前端框架可以帮助开发者显著提升网页的加载速度和用户体验。现代前端框架支持组件化开发,这是前端框架的一个重要特性。通过将界面拆分成多个可复用的组件,每个组件都有自己的生命周期和状态管理,开发者可以更加高效地构建和维护复杂的用户界面。综上所述,前端框架在Web开发中主要做简化和加速开发过程、支持组件化开发、提供数据绑定和状态管理、提供丰富的生态系统、确保跨浏览器兼容性以及性能优化等方面的工作。
2024-11-19 16:10:24
698
原创 低代码设计器的栅格布局和绝对定位布局对比
而绝对定位的自由布局适用于需要精确控制和更自由的设计需求。绝对定位的自由布局:绝对定位的自由布局是通过设置元素的位置属性和偏移量来实现的,可以将元素精确地放置在页面的任意位置。栅格布局:栅格布局是一种基于网格系统的布局方式,通过将页面划分为等宽的列,然后将元素放置在这些列中,以实现页面的布局。精确控制:绝对定位可以精确地控制元素的位置和大小,适用于一些需要特定布局效果的场景,如特殊效果、层叠布局等。自由度高:绝对定位可以让设计师更加自由地布局页面,没有网格的限制,可以实现更加创新和独特的设计效果。
2023-10-27 09:47:24
319
原创 js中的new方法
4,若构造函数返回的是一个对象则返回此对象,若非,则返回新创建的对象;1,创建一个新对象,将新对象的proto属性指向原对象的。此过程完成了创建对象、对象继承、属性初始化过程,被称为隐式原型继承;new方法的作用:创建一个实例对象,并继承原对象的属性和方法;2,构造函数执行环境中的this指向新对象;3,执行构造函数中的代码;
2023-10-17 21:08:37
810
原创 HTML渲染过程
3,设置成display为none的元素,不会进入渲染树,对于那种具备复杂逻辑的元素,可以优先隐藏它,等它计算完成后再显示,这样可以减少重排的次数,只在显示和隐藏的两个点进行重排,只会有两次;2,将需要多次触发重排的样式操作,改成绝对定位和固定定位,这样可以脱离文档流,它的改变不会改变其他元素的重排,比如动画操作时,设置成绝对定位;JavaScript 引擎:js可以修改网页的内容、css信息,目的是将代码的逻辑对应到dom元素和css中,形成新的布局,改变渲染的结果;1,将多次改变样式的行为合并成一次;
2023-10-17 14:50:46
744
原创 原型和原型链
2,原型:被继承过来的对象叫原型,继承的属性可通过构造函数的prototype对象找到。js的继承机制:原型对象的所有属性和方法,都可被实例对象共享,不仅节约内存,体现了实例对象间的联系。对象的原型属性是用来继承属性的,原型属性在实例创建之初就设置好的,通过对象直接使用Object.prototype作为他们的原型。对象不仅是具备自有属性,还可以成为原型继承过来的属性,分为两大类:继承属性、自有属性;每个js对象都和另一个对象相关联,另一个对象便是它的原型,每个对象都从原型继承属性。
2023-10-16 22:00:53
541
原创 云资源上传的审核机制
需要注意的是,审核机制应该是一个综合的、多层次的过程,结合自动化和人工审核的方法,以尽可能减少误判和漏判的情况。同时,应该建立相应的申诉和处理机制,以处理用户对审核结果的异议或投诉。持续监测:建立持续监测机制,对已上传的资源进行定期或实时的监测,以确保资源的合规性。人工审核:对于无法通过自动化检测的资源,可以进行人工审核。这可以由专门的审核团队或者多个审核人员进行,以确保资源的合规性和安全性。规则和策略:制定明确的规则和策略,明确禁止上传的内容类型和行为,如暴力、色情、违法等。
2023-10-07 13:48:37
274
原创 vue 路由缓存
使用两个 router-view 标签分别作为缓存和不缓存的路由出口在路由配置的时候只需要给要缓存的页面加上 meta 属性然后添加 keepAlive 属性设置为 true 即可。同样直接用 keep-alive 标签包裹 router-view 标签然后使用 include 指定需要缓存的页面的 name 名称。直接用 keep-alive 标签包裹 router-view 标签就能缓存全部的页面了。注意是缓存页面的 name 名称而不是缓存页面路由的 name 名称。
2022-12-12 14:55:40
1541
原创 entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit
if (process.env.NODE_ENV === 'production') {// 为生产环境修改配置...productionSourceMap: false, // 生产环境是否生成 sourceMap 文件。assetsDir: "static", //放置生成的静态文件目录(js css img)config["performance"] = {//打包文件大小配置。outputDir: 'dist', // 输出文件目录。publicPath: './', // 基本路径。
2022-10-28 09:00:07
7350
1
转载 vue展示.md文件
将md文件作为组件导入,注意:class的值必须包含 markdown-body ,否则样式无法生效!链接:https://www.jianshu.com/p/a84f8ddf0b04。需求:在vue项目中导入并展示markdown文件(使用的vue-cli3)安装 vue-loader 、vue-template-compiler。安装 github-markdown-css、highlight.js。在vue.config.js中配置webpack。安装 vue-markdown-loader。
2022-10-08 10:43:11
1023
原创 报错Unknown custom element: <组件名> - did you register the component correctly?的原因及解决办法
模块系统发现它需要 A,但是首先 A 依赖 B,但是 B 又依赖 A,但是 A 又依赖 B,如此往复。为了解决这个问题,我们需要给模块系统一个点,在那里“A 反正是需要 B 的,但是我们不需要先解析 B。第三种:检查引入的组件 确定是否需要{} , import XXX from "...." 还是 import { XXX } from "...."假如有A,B两个组件,渲染A组件的时候,A组件中引入了B组件显示,在渲染B组件的时候又引入了A组件,会导致控制台一直报是否正确注册了组件的错误。...
2022-08-17 17:14:08
65329
3
原创 vue兼容谷歌48(含qiankun兼容)
控制台定位到相应插件的js,找到插件:1,在vue.config.js中配置:'transpileDependencies': ['@jiaminghi/*',],transpileDependencies为特别需要将es6代码翻译成es5的插件说明;2,css3的var兼容:npm install css-vars-ponyfill mutationobserver-shim —saveimport 'mutationobserver-shim'import cssVar
2022-04-26 09:17:51
2689
原创 html转成base64/blob/file
import html2canvas from 'html2canvas'async saveImage(divText, _this) { let canvasID = _this.$refs[divText]; let a = document.createElement('a'); return new Promise((resolve, reject) => { html2canvas
2022-04-20 14:38:34
1339
原创 单文件vue.js组件化
<body style="background-color: #E7F1FF;height:100vh;"> <div id="loginhtmlshow"></div> <div id="loginhtml" class="height100 lglr flexbox"> <userdifine /> </div> <script type="text/javascript"&.
2022-03-17 19:54:08
273
原创 vue兼容谷歌48版本
控制台打开报错的文件,定位到相应的插件;在vue.config.js中配置:'transpileDependencies': [/[/\\]node_modules[/\\](.+?)?exceljs(.*)/, /[/\\]node_modules[/\\](.+?)?crypto-js(.*)/]css3不兼容:npm install css-vars-ponyfill mutationobserver-shim —savemain.js中配置:import 'mutatio
2022-02-22 13:49:39
1882
转载 Mac下 svn 的分支管理
背景对项目启新版版本,在原来基础上创建一个分支。由于在 mac 没有好的图形界面,只能选择 命令行 模式操作创建新分支svn cp -m "我的新分支" https://tianya@192.168.5.18/svn/mytest/iosApp/Glaucus https://tianya@192.168.5.18/svn/mytest/iosApp/xGlaucus 在任何目录下都进行这条命令,因为与本地工作目录没有任何联系这条命令执行后,会有这样的提示:Err
2022-01-17 08:55:49
641
转载 前端预览 PDF 文件
PDF.js 是什么?PDF.js由 Mozilla 提供支持。目标是创建一个通用的、基于 Web 标准的平台,用于解析和呈现 PDF。预览 PDF使用 iframe、embed、新窗口打开测试地址,方案比较简单,属于看天吃饭,全靠浏览器爸爸赏。使用方式<embed src="https://www.lilnong.top/static/pdf/B-4-RxJS%E5%9C%A8React%E4%B8%AD%E7%9A%84%E5%BA%94%E7%94%A8-%E9%BE.
2022-01-12 15:53:03
790
原创 vue阻止重复点击preventReClick需改进
为实现统一的防止重复点击触发方法,查看了网上资料显示:一,引入preventReClick.jsimport Vue from 'vue' const preventReClick = Vue.directive('preventReClick', { inserted: function (el, binding) { el.addEventListener('click', () => { if (!el.disabled) {
2022-01-11 15:07:50
1323
1
转载 onClick 和 addEventListener 比较
JS事件绑定(addEventListener)和普通事件(onclick)有什么区别普通事件(onclick)普通事件就是直接触发事件,同一时间只能指向唯一对象,所以会被覆盖掉。代码如下:var btn = document.getElementById("btn");btn.onclick = function(){ alert("你好111");}btn.onclick = function(){ alert("你好222");}1234567输出的结果...
2022-01-11 14:21:17
258
原创 $event获取当前元素
<p @click="onClick">点击获取当前元素</p>分两种:// e.target 是你当前点击的元素// e.currentTarget 是你绑定事件的元素
2022-01-11 14:04:07
881
原创 require图片相对路径时,有些图片能显示,有些不能
let img = require(`../assets/images/index/icon_ku.png`) let img2 = require(`../assets/images/index/icon_DB2.png`) console.log(img) // 结果:/img/icon_ku.b259504f.png console.log(img2) // 结果:data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAAtCAYAAAD7na..
2022-01-06 10:38:10
1799
原创 用js实现圆弧布局
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> <style> #circle{ width: 300px; height: 300px;..
2021-11-25 08:36:34
1025
原创 vue 刷新当前路由
<router-view v-if="isRouterAlive" />isRouterAlive:truereload() { this.isRouterAlive = false this.$nextTick(() => { this.isRouterAlive = true })}
2021-11-22 17:03:47
729
原创 JS向下向上取整等数字处理
只保留整数部分(丢弃小数部分)parseInt(5.1234); // 5向下取整(<= 该数值的最大整数,和parseInt()一样)Math.floor(5.1234); // 5 向上取整(有小数,整数部分就+1)Math.ceil(5.1234); // 6四舍五入(小数部分)Math.round(5.1234); // 5Math.round(5.6789); // 6取绝对值Math.abs(-
2021-10-19 10:16:51
576
转载 前端组件库大合集-必备收藏
前端组件库 搭建web app常用的样式/组件等收集列表(移动优先) 0. 前端自动化(Workflow) 前端构建工具 Yeoman – a set of tools for automating development workflow gulp – The streaming build system grunt – the JavaScript Task Runner F.I.S – 前端集成解决方案 前端模块管理器 Bower – A p..
2021-09-18 17:53:49
14597
1
转载 element Form当el-input有焦点时,按下回车会发生页面刷新事件
问题描述:在提交某项业务时,需要输入一次密码,点击下方确定后提交,但是当el-input有焦点时,按下回车会发生页面刷新事件,url中的参数也被清空。代码如下:<div class="password ft12"> <el-form> <el-form-item label="密码:" label-width="95px" prop="password" class="password"> <el-input clas...
2021-09-10 10:36:27
368
转载 vue之$emit返回值
vue之$emit返回值应用场景:子组件调用父组件的方法并获取到父组件方法的返回值// 父组件getdata(){ return data}// 子组件let data = this.$emit("getdata", bounds)return data这种写法是错误的,拿到的data是指向方法的this,无法获取到data正确写法:// 父组件getdata(bounds, callback){ callback(data)}// 子组件let d
2021-08-27 17:35:58
6881
1
转载 同一浏览器下多用户登录问题解决
问题:在如果在同一个浏览器下只有一个用户登录的情况,在服务端可以使用 Session 存储用户登录信息。但是在项目中如果需要在同一个浏览器下允许多个不同的用户登录,这样做会存在问题,因为服务端区分不同用户是通过 Cookie 中存储的 JSESSIONID 区分的,如果 JSESSIONID 相同,那么他们在服务端将会使用同一个 Session 对象。而同一浏览器使用的 Cookie 是相同的, 从而 JSESSIONID 也是相同的,无法区分不同的用户。当浏览器登录第一个用户后,用户信息写入到 Ses..
2021-08-05 09:57:25
7106
原创 Promise.all和Promise.race方法区别
Promise.all:1,有一个失败的请求,其他都失败;若需弥补这个缺陷,在每个Promise中增加Catch错误捕捉,且return出来;2,返回结果的顺序按照参数的顺序进行;Promise.race:1,根据第一个请求来返回结果,若第一个成功,全局都成功,第一个失败,全局都失败;2,返回结果的顺序,按请求时间顺序来,时间快的先返回;...
2021-07-19 11:00:28
1307
转载 Promise.all同时处理多个请求
需求:多个请求,不管成功或失败,都希望拿到这些请求的结果,比如,第一个请求失败了,后面的请求还是继续,请问怎么实现?初版将所有的异步请求的结果放入一个数组 使用 Promise.all 来处理 代码如下:// Vue.prototype.$http = axios data() { return { data: {}, ids:['https://cnodejs.org/api/v1/topics','https://cnodej
2021-07-19 10:46:15
1479
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人