自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

马优晨

撰写自己前端开发心得

  • 博客(647)
  • 资源 (2)
  • 收藏
  • 关注

原创 图片和PDF展示预览、并支持下载

第三步:编写FilePreview实现图片和PDF预览组件。展示图片和PDF类型,并且点击图片或者PDF可以预览。第二步:编写downloadcard组件。第一步:遍历所有的图片和PDF列表。

2024-06-05 11:56:10 384

原创 使用throttle防止按钮多次点击

如上图所示,点击按钮,防止按钮点击多次。

2024-06-05 11:26:59 256

原创 Element UI上传图片和PDF,支持预览,并支持复制黏贴上传

这里主要需要再header中设置 'Content-Type': 'multipart/form-data' 还有依赖的Token等字段内容。如上图,使用Element UI的el-upload组件,并且预览的时候可以展示图片和PDF格式文件;再次基础上,我们对上面代码进行改造,添加监听past事件。发现图片已经上传到组件中了。

2024-06-05 11:00:05 644

原创 Element UI上传图片和PDF,支持预览

如上图,使用Element UI的el-upload组件,并且预览的时候可以展示图片和PDF格式文件;

2024-06-05 10:33:06 626

原创 一个简单的布局

【代码】一个简单的布局。

2024-05-15 15:49:31 207 1

原创 前端通知组件封装

如果所示,实现如上图效果,点击小铃铛,从右侧展示通知,点击其中一条调到另一个页面;

2024-05-15 14:53:29 338

原创 前端工程化,前端监控,工作流,部署,性能

创建项目的时候,配置下ESlintstylelintprettiercommitlint等;ESLint 是一个静态代码检查工具,用于在 JavaScript 代码中识别和报告模式。它的目标是提供一个插件化的 JavaScript 代码质量工具。在前端开发过程中,ESLint 能够帮助开发者发现代码中的错误、不符合规范的地方,从而提高代码质量。.eslintrcStylelint 是一个强大的、现代化的 CSS/SCSS/Less 检查工具,可以帮助开发者遵循一致的代码风格和最佳实践。

2024-05-11 15:46:40 668

原创 如何利用AI提高内容生产效率?

在业务开发中会遇到各种个样的问题,怎么才能快速的提高开发效率是每一个人将要面对的;那在现今的AI时代,如何可以使用AI提高内容生成效率这个就是我们现在要讨论的话题;AI在内容生成方面已经展现出了巨大的潜力,可以帮助我们显著提高内容生产的效率。以下是一些具体的方法:AI文章生成器:基于用户输入的关键词或主题,AI文章生成器可以快速生成符合要求的文章。这些生成器通常基于大量的语料库进行训练,能够模仿人类写作风格,生成通顺、连贯的文章。

2024-05-11 11:55:16 545

原创 前端双语实现方案(VUE版)

结构如下en.jszh-CN.jsindex.js。

2024-05-08 11:37:40 818

原创 element UI 设置type=“textarea“ 禁止输入框缩放

时,默认情况下,用户可以通过拖动输入框的右下角来调整其大小。如果您想禁止这种缩放行为,您需要使用 CSS 来覆盖默认的浏览器行为。时,默认情况下,用户可以通过拖动输入框的右下角来调整其大小。如果您想禁止这种缩放行为,需要使用 CSS 来覆盖默认的浏览器行为。:如果您在单文件组件中使用 Vue,并希望仅在该组件中应用此样式,可以使用 scoped CSS。确保这个 CSS 规则在 Element UI 的样式之后加载,以确保它可以正确地覆盖默认样式。注意上图,第一张是可以缩放的,第二章不能缩放的。

2024-04-10 19:54:30 1201

原创 制作一个评价卡片

2024-04-10 14:48:30 232

原创 多张固定宽度元素,随着屏幕尺寸变化自动换行

多张固定宽度元素,随着屏幕尺寸变化自动换行。

2024-04-10 14:38:05 388

原创 饿了么实现一行四张卡片

如图实现上面的卡片展示。

2024-04-01 20:39:24 279

原创 轮播卡片切换实现

如上图,实现一个轮播卡片能力,支持手动滑动,手动拖动,已经点击两端切换按钮。

2024-04-01 19:52:49 179

原创 使用jscpd对比重复代码

检查项目中重复的代码,或者代码片段。

2024-03-21 11:58:17 499 2

原创 使用VS Code Counter统计代码量

项目需要统计每个文件有多少行,有多少行注释,多少行空白;1、在应用中心搜索 VS Code Counter 安装。3、输入Counter。选择对应项目开始计算。

2024-03-21 11:39:47 425

原创 MAC iterm 显示git分支名

要在Mac上的iTerm中显示Git分支名,您需要使用一个名为“Oh My Zsh”的插件。Oh My Zsh是一个流行的Zsh框架,它提供了许多有用的功能和插件,包括在终端中显示Git分支名。4、更新iTerm设置:打开iTerm的设置,并确保在“Text”选项卡下选择了“Use system font”选项。2、启用Oh My Zsh插件:在Oh My Zsh插件列表中找到“git”插件,并将其启用。现在,您应该能够在iTerm终端中看到当前活跃的Git分支名。如果您尚未安装这些工具,请先进行安装。

2024-01-15 16:57:57 1134

原创 mac下配置git自定义快捷命令

编辑文件 vim .zshrc 按i进入编辑模式,加入 source ~/.bash_profile 后,esc,再输入 :wq 保存退出。在 ~/.bash_profile 中配置环境变量, 可是每次重启终端后配置的不生效。需要重新执行 : source ~/.bash_profile后,才会生效。1、自己是在bash中配置的环境变量,而当前系统使用的是shell。最后输入命令 source ~/.zshrc 刷新刚刚的配置。输出是/bin/zsh,说明使用的是zsh。终端输入:echo $SHELL。

2024-01-15 14:07:43 998

原创 网格布局(大练习)

最近对网格布局研究了一下,写了一个简单的demo。

2023-12-29 17:34:37 546

原创 github鉴权失败

如上图所示 git push 时发生了报错,鉴权失败;

2023-12-29 17:03:10 1675

原创 SVELTE调研

SVELTE使用,调用,数据对比,维护,社区等等。

2023-12-25 13:40:46 124

原创 2022年工作架构分析

最常见的表单通过类XML语法定义。一些库支持通过一些特定结构的 JSON (Schema)来生成类XML标签。表单设计器通过可视化编排产出 Schema 数据。所以可以粗略的认为 表单设计器就是Schema设计器。Schema 本身是一个JSON ,Schema 通过一些特定字段描述和定义 JSON的数据结构。schema动态数据。

2023-08-16 14:38:06 492

原创 CLI的使用

抽离自己业务定制的业务(比如:axios,http,图片处理)yoman的generator必须使用名称先初始化一下 tnpm init 然后安装 yeoman-generator 里面包含很多可以使用的方法链接到全局,变成全局模块升级yoman解法降低版本:结果。

2023-08-16 14:27:32 266

原创 Node 使用 MySQL

使用进行安装。

2023-08-10 16:28:40 542

原创 Node RESTful API说明

REST即;表述性状态转移是。满足这些约束条件和原则的应用程序或设计就是RESTful。需要注意的是,REST是设计风格而不是标准。

2023-08-09 17:40:30 174

原创 node配置Web 服务器

Web服务器一般指,是指驻留于因特网上某种类型计算机的程序,Web服务器的基本功能就是。大多数都支持服务端的脚本语言()等,并通过脚本语言从数据库获取数据,将结果返回给客户端浏览器。目前最主流的三个是。

2023-08-09 11:34:38 504

原创 网站构建说明

HTML 4.01CSS 的使用 (样式表)XHTMLXML 和 XSLT客户端脚本服务器端脚本通过 SQL 管理数据Web 的未来HTML 4.01通过 HTML 4.01,所有的格式化信息可以被移出 HTML 文档,转而放入一个独立的样式表中。层叠样式表(Cascading Style Sheets - CSS)样式通常被保存在 HTML 文档之外的文件中。外部样式表使有能力仅仅通过编辑一个简单的 CSS 文档来改变网站内所有页面的外观和布局。XHTML - HTML 的未来。

2023-07-27 16:34:59 370

原创 Font Awesome 5使用

Font Awesome 5 的专业版有7842个图标。要使用免费的Font Awesome 5 图标,您可以选择下载Font Awesome库,或者在Font Awesome注册一个帐户,并获得一个代码(称为KIT CODE),以便在将Font Awesome添加到网页时使用。

2023-07-25 19:59:17 699

原创 TCP/IP 介绍

TCP /IP 是(注释:通信协议是对的规则的描述,只有遵守这些规则,计算机之间才能进行通信。因特网浏览器和因特网服务器均使用 TCP/IP 来连接因特网。浏览器使用 TCP/IP 来访问因特网服务器,服务器使用 TCP/IP 向浏览器传回 HTML。因特网的地址也是 TCP/IP,比如:你的因特网地址 250.250.149.19 也是标准的 TCP/IP 协议的一部分TCP/IP 指传输控制协议网际协议TControlProtocolInternetProtocol。

2023-07-25 15:36:53 1088

原创 正则表达式测试(二)

匹配所有的字符,返回一个数组,包含匹配的所有内容,按顺序展开;注意:空格也会被匹配到匹配所有符合的字符,返回一个数组。匹配空白字符匹配非空白字符匹配 空白字符 + 非空白字符如上所示,除了空格其他的字母和数字都匹配到了如上所示,中划线没有匹配到,下划线匹配到了。

2023-07-11 10:54:59 507

原创 正则表达式测试(一)

第三行代码 str.match(patt1) 返回一个数组,实例中的数组包含 5 个元素,索引 0 对应的是整个字符串,索引 1 对应第一个匹配符(括号内),以此类推。最后,第四个括号子表达式捕获 Web 地址指定的路径和 / 或页信息。该子表达式能匹配不包括 # 或空格字符的任何字符序列。只能重复一次该子表达式。默认情况下的圆点 . 是 匹配除换行符 \n 之外的任何字符,加上 s 之后, . 中包含换行符 \n。第二个括号子表达式捕获地址的域地址部分。子表达式匹配非 : 和 / 之后的一个或多个字符。

2023-07-06 17:24:26 930

原创 什么是 Hooks,React Hooks简单使用

Hooks 译为钩子,Hooks 就是在函数组件内,负责钩进外部功能的函数。React 提供了一些常用钩子,React 也支持自定义钩子,这些钩子都是用于为函数引入外部功能。当我们在组件中,需要引入外部功能时,就可以使用 React 提供的钩子,或者自定义钩子。比如在组件内引入可管理 state 的功能,就可以使用 useState 函数,下文会详细介绍 useState 的用法。通过自定义 Hooks,可以将组件逻辑提取到可重用的函数中。名称以 “use” 开头;函数内部调用其他的 Hook。

2023-07-03 14:32:01 3050

原创 前端函数式编程基础

函数式编程,是一种编程范式,它将电脑运算视为函数运算,并且避免使用程序状态以及易变对象。比起命令式编程,函数式编程更加强调程序执行的结果而非执行的过程,倡导利用若干简单的执行单元让计算结果不断渐进,逐层推导复杂的运算,而不是设计一个复杂的执行过程。

2023-07-03 11:08:01 201

转载 掘金上收集的面试题

我觉得这里他给挖坑了,B登录了之后就会返回B用户的token,然后请求头带着的就是B的token,验证到的用户也就是B,我认为没有问题啊。我不太清楚他说的可能会有什么问题值啥情况,可能是我考虑不周全,如果有网友知道可以提醒一下我他想问的答案,让我学习一下。2、你们这项项目中有微信公众号、后台管理端、医生app端和小程序端,有没有提炼出一些公共的工具js,怎么提炼的?5、你做完一个项目之后写一些什么内容,让接手你的人能够看懂你的项目架构,并且迅速上手?1.2、常用的选择器有哪些,优先级怎么样?

2023-06-09 11:09:36 392

原创 函数柯力化模拟

一个函数可以接收多个参数,反复被调用;(返回的始终是函数)

2023-06-08 18:13:00 89

原创 实现ajax重连

实现一个模拟ajax请求,在失败后自动重连。可以传递重试次数和延迟时间!

2023-06-08 17:31:01 140

原创 每日自救学习计划

8:00~9:30 雅思【B站】+china daily。9:30~22:30 技术【博客、学习、阅读】7:00~8:00 早起锻炼 + 新闻财经。22:40~ 23:00锻炼【每日听力】10:30~12:00 工作。19:00~20:00 工作。23:00~23:20洗漱。

2023-06-02 09:56:19 102

原创 h5唤起小程序

自 2022 年 4 月 11 日起,URL Scheme有效期最长 30 天,不再支持永久有效的URL Scheme、不再区分短期有效URL Scheme与长期有效URL Scheme。每个独立的URL Scheme被用户访问后,仅此用户可以再次访问并打开对应小程序,其他用户无法再次通过相同URL Scheme打开该小程序。在本次规则调整生效前已经生成的URL Scheme,如果有效期超过30天或长期会被降级为30天有效,只能被1个用户访问,开始时间从调整日期开始计算。

2023-05-17 10:36:04 580

原创 背景图占满手机全屏

在工作开发中,需要一个背景图占满全屏,这个时候需要怎么处理呢?

2023-05-17 10:16:21 141

原创 typescript声明

d.ts”文件用于为 TypeScript 提供有关用 JavaScript 编写的 API 的类型信息。这个想法是你正在使用像jQuery或underscore这样现有的 javascript 库。你想使用 TypeScript 来消费 这些 jQuery 库实现的API。你可以编写仅包含类型注释的d.ts文件,而不是在 TypeScript 中重写jquery或underscore或其他任何内容。

2023-03-21 15:20:22 323

SVELTE调研,关于SVELTE使用,性能,数据存储,数据分析等

SVELTE调研,关于SVELTE使用,性能,数据存储,数据分析等

2023-12-25

迭代器的配置,数据创造

迭代器的配置,数据创造

2023-08-18

营销模块数据,萨巴卡三角形

营销模块数据,萨巴卡三角形

2023-08-18

斯巴卡三角形,数据分析

斯巴卡三角形,数据分析

2023-08-17

千墨2023总结,简单的都是描述

一些简单描述

2023-07-31

哈哈哈,就是工作报告内容

哈哈哈,就是工作报告内容

2023-06-01

jqueryGoToTop.zip

前端页面回到底部按钮,滚动超过一屏会出现,一屏幕内会消失,点击会将页面缓慢滚动到顶部,非常实用。可以替换滚动图标,可以设置滚动时间。

2020-06-22

ejs常用操作.zip

ejs数据处理,express数据处理,欢迎下载。数据渲染,数据遍历,引入文件,动态处理数据,数据转移和非转移 等等~~~~

2020-06-20

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除