- 博客(611)
- 资源 (3)
- 问答 (1)
- 收藏
- 关注
原创 LogicFlow工作流在React和Vue3中的使用
LogicFlow 是一款流程图编辑框架,提供了一系列流程图交互、编辑所必需的功能和简单灵活的节点自定义、插件等拓展机制,方便我们快速在业务系统内满足类流程图的需求。
2024-08-12 10:26:37
492
原创 Django5实战
安装慢的解决方法:使用阿里云的镜像源4、创建应用:在根URLconf 文件中指定我们创建的 polls.urls 模块。函数 include() 允许引用其它 URLconfs。每当 Django 遇到 include() 时,它会截断与此项匹配的 URL 的部分,并将剩余的字符串发送到 URLconf 以供进一步处理。测试,启动项目,访问http://127.0.0.1:8000/polls/
2024-08-10 22:50:43
887
原创 Content-Type 详解
常见的Content-Type类型包括text/plain、text/html、application/json、application/xml、image/jpeg、audio/mp3和video/mp4等。某些应用程序可能依赖Content-Type来确定如何处理数据,如果缺失该信息,可能会导致数据无法正确地被处理或显示。通过正确设置Content-Type,服务器可以告知客户端如何解析和处理返回的数据,而客户端可以根据Content-Type来选择合适的方式来处理接收到的数据。
2024-08-09 22:40:28
445
原创 数据可视化工具汇总
Three.js是一个基于WebGL的JavaScript库,它简化了在Web浏览器中创建和展示三维图形的过程。Three.js拥有活跃的社区和众多的第三方插件,如GLTFLoader、OrbitControls等,提供了丰富的功能和扩展性。VTK是一款免费开放的软件工具,用于3D图形、建模、图像处理、科学数据可视化和其他信息可视化。
2024-07-31 14:41:26
830
原创 React/Vue项目解决跨域的方法
CORS是浏览器的一种机制,当发起跨域请求时,服务器可以返回一个特殊的响应头Access-Control-Allow-Origin来授权给定源访问该资源。只需要在服务器端设置响应头即可实现CORS。通过在请求中添加一个回调函数的参数,服务器返回的数据会包裹在该回调函数中,实现跨域获取数据。在上述示例中,将以/api开头的请求转发到http://api.example.com,并将请求路径中的/api部分去除。在上述示例中,将以/api开头的请求转发到http://api.example.com。
2024-07-22 22:06:07
586
原创 axios以post方式提交表单形式数据
某些后端框架请求接口必须走form表单提交的那种形式,但前端很少有这种写法去提交表单数据,所以前端需要用axios模拟一个表单提交接口。Content-Type 代表发送端(客户端/服务器)发送的实体数据的数据类型。
2024-07-15 21:55:24
582
原创 vue-router 4汇总
传递参数:src/components/Today.vue。接收参数:/src/components/Map.vue。路由配置:/src/router/index.ts。
2024-07-05 22:43:31
297
原创 前端文件预览汇总
vue-office支持多种文件(docx、excel、pdf)预览的vue组件库,支持vue2/3,也支持非Vue框架的预览。
2024-07-04 11:17:40
357
原创 Vue3系列:7、其它 API
通过使用 shallowRef()和 shallowReactive()来绕开深度响应。浅层式API创建的状态只在其顶层是响应式的,对所有深层的对象不会做任何处理,避免了对每一个内部属性做响应式所带来的性能成本,这使得属性的访问变得更快,可提升性能。
2024-05-25 22:13:52
381
原创 Vue3系列:6、组件通信
子 => 父。注意区分好:原生事件、自定义事件。原生事件:事件名是特定的(clickmosueenter等等)事件对象$event: 是包含事件相关信息的对象(pageXpageYtargetkeyCode自定义事件:事件名是任意名称事件对象$event: 是调用emit时所提供的数据,可以是任意类型!!!--在父组件中,给子组件绑定自定义事件:--> < Child @send-toy = " toy = $event " />
2024-05-25 22:12:18
322
原创 Vue3系列:4、路由
缺点:后期项目上线,需要服务端配合处理路径问题,否则刷新会有。通过点击导航,视觉效果上“消失” 了的路由组件,默认是被。作用:让路由组件更方便的收到参数(可以将路由参数作为。优点:兼容性更好,因为不需要服务器端处理路径。作用:控制路由跳转时操作浏览器历史记录的模式。作用:可以简化路由跳转及传参(后面就讲)。作用:将特定的路径,重新定向到已有路由。浏览器的历史记录有两种写入方式:分别为。参数时,需要提前在规则中占位。文件夹,一般组件通常存放在。掉的,需要的时候再去。的对象写法,必须使用。
2024-05-25 22:09:21
379
原创 浏览器原理及渲染引擎解析网页的过程、JavaScript 引擎解析 JavaScript 代码的过程
浏览器:是安装在电脑里面的一个软件,能够将页面内容渲染出来呈现给用户查看,并让用户与网页进行交互。服务器其实就是性能比较高的计算机,这些计算机 24 小时不断电、 不关机。开发者在本地开发出 HTML 网页文件、CSS 样式文件、JS 脚本程序等,然后上传给服务器进行存储和共享,用户就可以访问到这些资源了。例如;
2024-05-23 11:33:22
732
转载 JS性能优化策略
JS 是一门弱类型语言,拥有独特的原型链机制,在宿主中的拥有一套 DOM、BOM 操作接口,增加其性能控制的复杂性。JavaScript 主要应用场景依然围绕浏览器展开,所以,它在浏览器中的行为表现依然重要。本篇将从笔者的实践经验出发,分别从加载解析、语法优化、DOM 操作等各方面归纳总结优秀的 JS 代码性能优化策略。与此同时,关注如何编写更优雅干净的 JS 代码。
2024-05-23 10:02:52
87
原创 Webpack5高级优化:5、优化代码运行性能
但是这样的话就会有一个问题, 因为前后输出的文件名是一样的,都叫 main.js,一旦将来发布新版本,因为文件名没有变化导致浏览器会直接读取缓存,不会加载新资源,项目也就没法更新了。当我们修改 math.js 文件再重新打包的时候,因为 contenthash 原因,math.js 文件 hash 值发生了变化(这是正常的)。所以我们需要将打包生成的文件进行代码分割,生成多个 js 文件,渲染哪个页面就只加载某个 js 文件,这样加载的资源就少,速度就更快。所有文件 hash 值是独享且不同的。
2024-05-19 10:35:56
634
原创 Webpack5高级优化:4、减少代码体积
如果没有特殊处理的话我们打包时会引入整个库,但是实际上可能我们可能只用上极小部分的功能。是一个术语,通常用于描述移除 JavaScript 中的没有使用上的代码。开发如果项目中引用了较多图片,那么图片体积会比较大,将来请求速度比较慢。开发时我们定义了一些工具函数库,或者引用第三方工具函数库或组件库。Babel 为编译的每个文件都插入了辅助代码,使代码体积过大!你可以将这些辅助代码作为一个独立模块,来避免重复引入。默认情况下会被添加到每一个需要它的文件中。我们可以对图片进行压缩,减少图片体积。
2024-05-19 10:19:25
300
原创 Webpack5高级优化:3、提升打包构建速度
所以我们需要做到修改某个模块代码,就只有这个模块代码需要重新打包编译,其他模块不变,这样打包速度就能很快。我们目前打包的内容都很少,所以因为启动进程开销原因,使用多进程打包实际上会显著的让我们打包时间变得很长。开发时我们修改了其中一个模块代码,Webpack 默认会将所有模块全部重新打包编译,速度很慢。我们想要继续提升打包速度,其实就是要提升 js 的打包速度,因为其他文件都比较少。我们可以开启多进程同时处理 js 文件,这样速度就比之前的单进程打包更快了。我们启动进程的数量就是我们 CPU 的核数。
2024-05-19 10:11:47
716
原创 Webpack5高级优化:2、提升开发体验
它会生成一个 xxx.map 文件,里面包含源代码和构建后代码每一行、每一列的映射关系。当构建后代码出错了,会通过 xxx.map 文件,从构建后代码出错位置找到映射后源代码出错位置,从而让浏览器提示源代码文件出错位置,帮助我们更快的找到错误根源。此时如果代码运行出错那么提示代码错误位置我们是看不懂的。一旦将来开发代码文件很多,那么很难去发现错误出现在哪里。SourceMap(源代码映射)是一个用来生成源代码与构建后代码一一映射的文件的方案。所以我们需要更加准确的错误提示,来帮助我们更好的开发代码。
2024-05-19 10:03:48
244
原创 Webpack5高级优化:1、介绍
所谓高级配置其实就是进行 Webpack 优化,让我们代码在编译/运行时性能更好~主要介绍 Webpack 高级配置。
2024-05-19 10:00:39
84
原创 React中高阶组件
高阶组件:高阶组件就是一个接收一个组件并返回另外一个新组件的函数。普通组件:MyComponent.tsx。高阶组件:Hoc.tsc。使用:App.tsx。
2024-05-15 23:20:49
125
原创 css布局方式总结
使元素变成行内元素,拥有行内元素的特性,即可以与其他行内元素共享一行,不会独占一行.不能更改元素的height,width的值,大小由内容撑开.可以使用padding上下左右都有效,margin只有left和right产生边距效果,但是top和bottom就不行.
2024-05-14 14:30:19
776
原创 解决TS报错:Property ‘style‘ does not exist on type ‘Element‘
在使用queryselector获取一个dom元素,编译时却报错说Property 'style' does not exist on type 'Element'。原因:这是typescript的类型检查导致的,需要在querySelector方法前面加个类型断言。
2024-05-12 21:24:16
460
原创 create-react-app完整配置别名alias方法
在使用 create-react-app 创建的项目中配置路径别名,可以使用 react-app-rewired 这个库来覆盖 create-react-app 的默认配置。这样,@components/SomeComponent 就会被解析为 src/components/SomeComponent 文件。在项目根目录中创建一个 config-overrides.js 文件,用于自定义配置。
2024-05-09 21:40:44
544
原创 React常用组件分享
React Awesome SliderReact Slider Carousel Component - react-awesome-slider
2024-05-06 22:15:42
458
原创 centos7中检查内存方法
htop是top的一个增强版,提供了更友好的界面和更多的功能。如果你安装了htop,你也可以使用它来查看内存使用情况。根据你的需求,你可以选择最适合你的方法。在top界面中,你可以看到内存使用的相关统计信息,如%Mem行会显示内存的使用百分比。在CentOS 7中,你可以使用多种方法来检查内存使用情况。你也可以直接查看/proc/meminfo文件来获取详细的内存使用信息。top命令提供了一个实时的系统监控界面,包括内存使用情况。free命令是最常用的查看内存使用情况的工具之一。1. 使用free命令。
2024-04-22 15:22:05
1173
原创 Kubernetes JSONpath如何使用?
你可以使用 JSONPath 表达式来组合多个字段,并自定义输出格式。这条命令将返回 Pod 名称和 IP 地址,它们之间用制表符(\t)分隔,每个 Pod 的信息占一行。
2024-04-21 11:00:27
442
原创 在不能升级版本的情况下,解决k8s证书到期且续约只有1年的问题
Not Before 指证书有效开始时间,Not After 指证书有效截至时间,如果 Not After 小于当前时间,说明证书已经过期,且没有自动轮换,需要手动干预解决。5.执行以下命令,所有master节点使用更新后的 admin.conf 替换 /root/.kube/config 文件,出现提示时,输入 y 后回车;6.master节点执行以下命令,查看 k8s 组件证书更新情况,RESIDUAL TIME 为 y 则标识证书已更新,且有效期10年;
2024-04-18 22:49:13
602
将Google Analytics(分析)添加到Android 应用实例
2018-03-25
用百度WebUploader文件上传插件上传文件时能在前端对文件进行加密后再上传吗?
2019-10-15
TA创建的收藏夹 TA关注的收藏夹
TA关注的人