- 博客(1567)
- 收藏
- 关注
RSS订阅转载 React状态管理工具
react-redux 是的官方 React UI 绑定层，它允许您的 React 组件从 Redux 存储中读取数据，并将操作分派到存储以更新状态。@reduxjs/toolkit 是对 Redux 的二次封装，开箱即用的一个高效的 Redux 开发工具集，使得创建store、更新store等更简单。
2023-04-21 15:47:40
39
1
转载 vue3的请求封装
上述代码包含了部分其他内容，不展开，主要还是得靠自己理解。此处给对象一个remove方法，判断是否是路由拦截处调用根据情况取消请求。由于使用了ts 因此新增了部分 接口 来声明变量类型及包含的数据。上述a-demo-api.ts中代码并不全，待使用到接口时，还需要声明响应数据的结构。
2023-04-17 09:43:49
207
转载 VUE3 VUE-DEVTOOLS 安装
vue-devtools，对于vue前端开发者来说并不陌生，该工具能让我们实时查看当前页面数据，哪些组件被缓存，以及vuex的实时变量，总之有了这个工具，能帮我们更好排查问题。npm采用最新版本，需要注意的是，安装Vue-Devtools的依赖需要用到yarn，而不是npm，所以首先我们要安装yarn。由于众多开发者采用谷歌浏览进行开发且第一种方式显然是不支持的，一般我们无法访问到谷歌地址，因此本篇针对谷歌浏览器进行讲解。需要注意，这里的命令带了watch，如果不带watch，会出错。
2023-04-17 09:42:44
184
1
转载 JavaScript知识点Import Maps
关于不知道大家有没有听过，我之前只是知道JavaScript增加的新特性，具体什么作用也没有进行学习研究过，周末学习中看到有人使用它，于是也尝试了解一下~，后来发现确实还是挺好用的，所以写一篇文章给大家分享一下。我主要从以下几个方面来简单介绍一下。
2023-04-17 09:39:22
54
转载 React 拖拽排序组件库对比研究
react-dnddnd-kitreact-dnd文档齐全github star星数16.4k维护更新良好，最近一月内有更新维护学习成本较高功能中等移动端兼容情况，良好示例数量中等概念较多，使用复杂组件间能解耦文档齐全github star星数24.8k维护更新良好，最近三月内有更新维护学习成本较高使用易度中等功能丰富移动端兼容情况，优秀示例数量丰富是为垂直和水平列表专门构建的更高级别的抽象，没有提供 react-dnd 提供的广泛功能。
2023-04-17 09:38:34
49
转载 几个你不知道却非常实用的JavaScript APIs
读完这篇文章后，你现在可以灵活地了解这些API的存在以及如何使用它们。尽管它们在JS现状调查中的认知度排名最后，但它们非常有用，知道如何使用它们肯定会提高你的开发经验。这些强大的API并不为人所知，这意味着还有一些你我都不知道的有用的API，所以现在是探索并找到那个可以简化你的代码，并为你节省大量开发时间的API的最佳时机。
2023-04-17 09:37:31
33
转载 docker+jenkins+gitlab 部署你的前端项目
这时候我们已经打通了本地代码->gitlab-jenkins的这个环节了,然后我们编写shell脚本执行docker语句构建容器并且执行就OK了(1).在jenkins中配置shell脚本。
2023-04-17 09:35:57
24
转载 5个async/await最佳实践
这篇文章介绍了使用编写异步代码的 5 个最佳实践。文章中的第一个建议是在所有异步代码中使用。这样做的好处有以下几点：首先，它使代码库保持一致性。通过在所有异步代码中使用，你可以保持一致的代码编写和组织方式。此外，有助于提高代码可读性和易于维护。这是因为使用可以使代码看起来更像同步代码，从而使其更容易理解和修改。总之，使用 async/await 是编写高效、易于维护的异步代码的关键。下面是正文：在这篇博客文章中，我们将讨论- 一种在各种编程语言中编写异步代码的强大工具。但首先，让我们定义。简单来说，
2023-04-17 09:32:28
43
转载 使用File System Access API让浏览器拥有操作本地文件的能力
是一项Web API，允许Web应用程序从用户设备的本地文件系统中读取和写入文件。它提供了一种简单且安全的方法，让用户在不离开Web应用的情况下，从本地文件系统中操作文件。这项API为Web应用程序提供了更多的灵活性和功能，使其更接近于本地应用程序的体验。遵循同源策略，只允许Web应用程序在具有相同源的文件系统上进行操作。当用户使用该API时，会提示用户授权应用程序访问他们的文件系统。如果用户授权，则应用程序可以使用该API访问用户选择的文件和目录。使用。
2023-04-17 09:31:10
20
转载 实现自动化构建与部署
GitHub的默认issue在创建时并没有分的很细，虽然它提供了很多选项给提问者，但是大多数人在提问问题的时候，都不会注意到这些选项。的文件就是我们实现想法的地方，根据文档中所罗列的可供我们使用的方法，结合自己的需求完成配置的编写，GitHub Action就会按照我们的命令去做事情（命令式编程）。在GitHub的项目仓库中有一个Actions模块，它是一个持续集成（CI）和持续部署（CD）平台，开发者可以利用它提供的配置规则，通过编写。最后，在项目的actions面板就能看到此工作流的运行日志了。
2023-04-17 09:29:25
21
转载 JavaScript日期处理不再难！Day.js带你飞
表达数字日历日期并消除歧义的标准方法是国际标准化组织（ISO）日期格式。可以使用JavaScript日期方法，它以ISO格式返回新形成的日期，以确认此格式。
2023-04-17 09:19:04
169
转载 如何使用Gitlab CI/CD快速集成Kubernetes
正在上传…重新上传取消image.png搭建好Kubernetes集群GitLab实例启用GitLab容器注册表。创建一个Gitlab项目Gitlab 能够访问Kubernetes apiserver。配置并启用GitLab CI runner。kubectl 配置了Kubernetes集群访问。
2023-04-14 10:58:35
50
转载 2023年最全的Web前端开发必知必会详尽知识手册
Ajax并不指代某种编程语言或具体技术，它可以看做是一种标准或者思想，区别于传统 Web 网页应用，它最早提出使用异步 JS 技术来创建动态的网页，通过与服务器进行少量数据交换，在不重新加载整个网页的情况下来对网页部分内容进行异步动态更新，自 2005 年开始Ajax被大众所接受并逐渐成为主流，直至今天我们的大部分现代网页都在遵循着Ajax标准。狭义的Ajax主要关注点在于// 1. 处理响应回调...// 2. 初始化一个请求// 3. 设置请求头信息// 4. 发送请求复制代码除了使用。
2023-04-12 09:52:49
52
转载 2023年最全的ES6 万字极简总结
由于常用语法不多，有时需要查阅一些不常用的函数或特性，需要重新查看阮一峰大佬的《ESCAScript 6 入门》，这段时间有空余，正好整理出来所有知识点，并附带解释。帮你快速唤醒的已经忘记的知识点！： 声明变量： 声明只读常量 声明必须赋初始值 常量值不可修改：位置顺序解构：数据结构相同且同名变量解构 ：位置顺序解构，可解构()：根据传入参数类型不同 按照以上规则解构`` 使用模板字符串在模板字符串中使用变量 ：返回布尔值，表示是否找到了参数字符串。 ：返回布尔值，表示参数字符串是否在原字符
2023-04-11 10:10:40
72
转载 vh 存在问题？试试动态视口单位之 dvh、svh、lvh
简单再总结一下，本文通过 vh 在移动存在的问题入手，引出了规范新增的三大类新的和视口相关的单位。大视口（Large Viewport）小视口（Small Viewport）动态视口（dynamic viewport）它们的出现，极大的弥补了之前 vh/vw 等视口单位存在的问题。CSS 的更新迭代一直在快速持续，很多内容还是有必要不断了解学习，在不久的将来就能很快应用在业务中。此外，除了动态视口外，其实 CSS 还更新了与容器大小相关的相对单位 -- 譬如cqw和cqh。cqw。
2023-04-11 10:05:24
28
转载 vue中使用keep-alive缓存组件的理解和总结
前不久给一个老哥解决一个问题，他出现的问题是，每访问一次组件，切换组件的时候会把其他访问过的组件的网络请求全部重新发一遍，老哥找了几天，也找了很多人请教，没发现问题，我也是折腾了好大的功夫才找到问题，没错就是keep-alive这个标签的锅。而且这个老哥比较狠的是，他不是简单的用keep-alive包裹页面切换的，而是包裹在了app.vue里的里....大概结构长这样当去掉app.vue里的keep-alive之后问题就解决了，借此契机，咱们今天详细讲讲，这个keep-alive，到底是怎么个用法。
2023-04-11 09:52:45
62
转载 简历丢给chatGPT，他问了我这些问题
这样我们此次模拟面试就获得了9条关于项目的问题，和25条关于基础的问题，细看这几个问题都是明显贴合我的简历所问的问题，大部分面试官都是会针对简历进行面试，所以根据自己的简历整理可能提到的问题是非常重要的，而关于项目方面提出的问题，与我进行大厂模拟面试所遇到的问题更为相像。通过chatGPT进行模拟面试，算得上是一场挺有质量的面试了。
2023-04-11 09:46:45
57
转载 你知道，前端工程部署有哪些方式嘛？
前端应用部署变化到现在的阶段，也是项目众多不便于管理导致，实际的业务情况，进而推动部署方式的发展。前端部署的流程，在每个公司都有一套自己的，学习它，适应它，就好了，没有太多疑难问题。
2023-04-11 09:41:10
28
转载 按钮级别权限多种控制方法实现
要做权限控制，肯定需要一个code，无论是权限码还是角色码都可以，一般后端会一次性返回，然后全局存储起来就可以了，是在登录成功以后获取并保存到全局的store接下来它提供了三种按钮级别的权限控制方式，一一来看。
2023-04-11 09:32:03
213
转载 v-for比v-if优先级更高？vue3:不存在的
v-if和v-for哪个优先级更高呢？这是面试官常常问到的一个问题，如果是在三年前，我会毫不犹豫的回答当然是v-for哩，但在3202的今天，如果还这么答，显然是低估了前端技术的日新月异啰。下面我们就来结合编译结果，一探究竟吧。注意了⚠️，以上问题一般指的是v-for和v-if连用的情况，比如复制代码显然，在V2当中，v-for的优先级更高，而在V3当中，则是v-if的优先级更高。
2023-04-11 09:30:43
23
转载 node构建脚手架
创建一个完整的脚手架复制代码program.option('-f --framwork [other...]', '设置框架', getFramwork).description('创建项目')init();}).description('下载内容')})复制代码重写)//判断是否存在package.json文件//判断是否选择了eslint//写入模板//重新写入package.json文件。
2023-04-11 09:24:45
19
转载 vue2实现甘特图
(1)直接引入dhtmlx甘特实现的图表操作描述全是英文的，所以要对现有的属性数据显示要进行汉化文字代替。使用需要很多配置项，在原生版进行详情介绍，vue版只做基本使用。以上内容只是部分收费内容，并非全部收费内容。收费的甘特图功能一般在这放开。自定义修改gantt样式文件。弹窗表单----见汉化图例。local---本地汉化。gantt加载数据格式。gantt功能插件挂载。
2023-04-10 09:42:38
42
转载 从JS基础知识到Web API(ajax-跨域-存储)
3. 描述cookie localStorage sessionStorage 的区别。6. 无限下拉的图片列表,如何监听每个图片的点击?3.attribute和property的区别?2.CORS-服务器设置 http header。3.一次性插入多个DOM节点,考虑性能。4. 编写一个通用的事件监听函数。3.跨域:同源策略,跨域解决方案。5. 如何识别浏览器的类型。4.手写一个简易的ajax。1.DOM是哪种数据结构。2.DOM操作常用API。5. 描述事件冒泡的流程。5.跨域的常用实现方式。
2023-04-10 09:39:16
10
转载 nuxt3+pinia环境下实现数据持久化
在我写nuxt3项目时，遇到了使用pinia在页面刷新时数据丢失的老生常谈的问题，在这里简单记录下我的解决方案文章主要介绍了两种使用vueuse的useStorage使用pinia的插件。
2023-04-10 09:37:28
321
转载 Docker部署前端vue+node（前端入门篇）
Docker 是一个开源的应用容器引擎,可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中，然后发布到任何流行的 Linux 机器上，也可以实现虚拟化。容器是完全使用沙箱机制，相互之间不会有任何接口。简单点就比如你去一个商场，商场里有很多专卖店，小吃店，化妆品店，这些店就好比容器，你根据自己的需求去哪个店就好，而且这些店本质上互不干扰对方做生意vue我就不介绍了，这玩意都写的我想吐了。node呢，现在是很多中高级前端常备的一个技能了，毕竟没那么多精力学java和世界上最好的语言php了。
2023-04-10 09:35:10
139
转载 Vite 创建 Vue3+TS 项目配置 ESLint
如题所示，本文将使用 Vite 脚手架创建 Vue3+TypeScript 项目进行 ESlint 的配置，并采用 Standard 规范。想要跳过本文介绍直接进行相关配置的，可以参考文章末尾总结内 Git 仓库的代码提交记录。经过以上一系列的操作，我们使用 Vite 这个脚手架去创建一个了 Vue3+TypeScript 的项目，进行 ESLint 的配置，采用 Standard 规范，并且实践到我的个人项目里使用了一段时间也没什么问题。
2023-04-10 09:34:37
728
1
转载 Vuex怎么实现懒加载？
因为最近在面一家某在线教育公司的时候，被问到了一道印象比较深刻的题，就是如题目所示：“Vuex怎么实现懒加载”，因为之前的确没有考虑到vuex的懒加载问题，所以就没怎么去思考过这个问题，因此也就被问得一头雾水。现在不懂无所谓，以后再不会就感觉丢大人了。所以，回来之后就研究了一下这个问题和vuex的文档，也得到了自己想要的答案。
2023-04-10 09:28:55
32
转载 Vue3开发的基本技巧
• setup语法糖• 可以通过Composition API（组合式API）封装可复用逻辑，将UI和逻辑分离，提高复用性，view层代码展示更清晰• 和Vue3更搭配的状态管理库Pinia，少去了很多配置，使用起来更便捷• 构建工具Vite，基于ESM和Rollup，省去本地开发时的编译步骤，但是build打包时还是会编译（考虑到兼容性）• 必备VSCode插件Volar，支持Vue3内置API的TS类型推断，但是不兼容Vue2，如果需要在Vue2和Vue3项目中切换，比较麻烦。
2023-04-10 09:27:28
12
转载 打造组件库之table组件
props: {columns: {},data: {复制代码// 组装tablereturn (return (复制代码到此，根据上面的需求已经实现了对应的可配置的table组件，比较核心的是上面两个生成方法（_renderHeader,_renderBody）大概也就20行,对于熟悉的JSX和作用域插槽的同学来说再容易不过了,希望此文章对你有帮助。
2023-04-10 09:27:11
11
转载 面试官对会Vue的灵魂拷问
vue是一门渐进式的javascript框架。所谓的渐进式就是：从中心的的视图层渲染开始向外扩散的构建工具层。这过程会经历：视图层渲染->组件机制->路由机制->状态管理->构建工具；五个层级。特点：易用，灵活，高效，入门门槛低。图来自百度👆。
2023-04-07 09:53:53
26
转载 vue+nuxt开发项目
middleware顾名思义就是中间件的意思，在中间价可以做路由拦截，参数过滤等等...middleware有以下三种定义方式。middleware的第一参数是一个上下文参数，能够解构出route,params,query等等...参数，足够我们做各种骚操作。既然它们能够定义在不同位置，那么它们的执行顺序就有前有后👇。
2023-04-07 09:51:31
89
转载 让你的vue项目体积更小点，打包速度更快点
有时候开发完一个vue项目后，会发现项目包又大打包速度还慢，里面还有很多冗余的文件，比如图片，.vue文件，.js文件等，如果你也遇到类似问题，或者你希望你的项目包更小点，打包速度更快点，本文也许对你有所帮助。
2023-04-07 09:51:22
82
转载 Vue 改进了响应式 API 中 getter 的用法
近日，Vue 改进了响应式 API 中getter的用法，主要包括：一个用于将不同来源（value / ref / getter）规范化为的 API（通过引入toValue()一个用于将不同来源（value / ref / getter）规范化为的 API（通过增强toRef()引入和类型通常需要将状态传递到组合式函数中并保持响应性。目前，toRef仅用于从对象中“提取”单个属性。上面的代码有两个问题：调用toRef时props.foo可能不存在如果props.foo。
2023-04-07 09:45:25
16
转载 svelte + vite 开发 Web Components
需要将自定义 Svelte 组件转成通用的 Web Component ，这样才可以在其他框架中直接使用。需要在 svelte.config.js 文件中 compilerOptions: { customElement: true }host然后在组件内定义元素名称host在index.js 中导出host。
2023-04-07 09:43:43
50
转载 Chrome 112 ：CSS 支持嵌套语法、document.domain 正式禁用
上实现平滑的过渡效果是一个非常复杂的任务，我们往往会借助一些三方的动画库去实现，这些库的兼容性和性能往往是比较困扰我们的事情。版本中正式支持了，支持嵌套的样式规则允许我们将规则嵌套在父选择器中，而不需要重复写父选择器，这样就可以极大简化。嵌套语法可以帮助开发者减少选择器的重复编写，同时将相关元素的样式规则放置到一起，也可以更快速的匹配到这些样式的。这个元素，我们就不需要在样式文件里去搜索所有和它相关的选择器的实例了，只需要把这个样式组删除了就可以。) 提供支持，其他的渲染模式的支持也正在施工中 ~
2023-04-07 09:43:11
18
转载 es6的Symbols
这篇信息性的博客旨在深入介绍JavaScript语言中固有的著名symbol，例如和Symbol.for。这些symbol代表着复杂而多才多艺的工具，可以用来增强和调节代码的行为。在JavaScript环境中全面理解可用symbol是开发高性能、可维护和可扩展应用程序的关键。因此，在项目的概念化和实施阶段，建议评估将这些symbol纳入其中的可行性，以使代码更加简洁、优雅，达到预期的效果。
2023-04-07 09:42:06
5
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人