SF
eveningwater
eveningwater
注册登录
关注博客
注册登录
主页
关于
RSS
js实现大数字求和
夕水
3 月 4 日
阅读 2 分钟
1.3k
在现代编程中,处理超大数字常常会遇到限制,因为大多数编程语言的数字类型在存储较大的整数时可能会溢出。为了解决这一问题,通常采用字符串表示法来处理大数字。在这篇文章中,我们将深入探讨如何通过字符串实现大数字的求和,展示一个简单而有效的 JavaScript 函数。
花了半天时间,我开发了一个json-schema-editor-visual
夕水
3 月 4 日
阅读 7 分钟
429
在公司的项目业务当中,需要基于json-schema实现一个可以可视化编辑器,当前有不错的实现方案,如:json-schema-visual-editor。但事实上,这个交互并不满足于我们需求设计的那样,于是我重新开发了一款json-schema-visual-editor。
一起来学习如何写单元测试
夕水
3 月 4 日
阅读 8 分钟
297
以我用typescript实现的轻量高度可配置的消息提示框插件为示例,来详细讲述添加单元测试。市面上有很多测试框架,这里我还是选择比较老牌但也很流行的测试框架jest为示例。
一起来动手实现一个ai聊天对话
夕水
3 月 4 日
阅读 21 分钟
630
本文,我们将根据前文来实现一个ai聊天对话项目,感受真实的业务。项目技术栈vite---一个前端工程构建工具。antd --- 一个react ui组件库。@ant-design/icons ---- 一个react图标库。mockjs --- 模拟消息对话数据。dayjs --- 一个日期处理库react --- 一个javascript框架。typescript --- javascript的超集。ew-message ...
前端实现ai会话聊天的核心原理三步篇
夕水
2 月 5 日
阅读 13 分钟
1.8k
流式回复的效果就像是打字效果一样,当然与打字效果也有差异,那就是打字效果是一个字一个字的接替出现,而流式效果就是在打字效果的基础上一句话或者一个段落那样接替出现。
一个有趣的效果--动态生成动画导航
夕水
2 月 5 日
阅读 6 分钟
498
在接下来的这个项目中,我们即将使用纯 JavaScript 和 CSS 来创建一个具有动态动画效果的导航栏。这篇文章将详细解析该代码的实现,包括 HTML 结构、CSS 样式、JavaScript 逻辑等方面,帮助你理解每一个步骤和实现思路。文章内容将逐步拆解,涵盖从页面结构、样式设计到功能实现的各个细节。
SCSS即将废弃`@import`,以前的`@import`该何去何从?
夕水
2 月 5 日
阅读 4 分钟
492
随着前端开发技术的不断发展,SCSS(Sass)作为一种流行的CSS预处理器,已经在众多前端项目中得到了广泛应用。其优雅的语法、强大的功能以及灵活的模块化机制,使得开发者能够更加高效地构建和管理样式表。然而,随着SCSS的不断迭代更新,我们也迎来了一个重要的变革:@import语法即将被废弃。虽然@import曾经是SCSS的核...
我的2024-人生须为有益事
夕水
2 月 5 日
阅读 4 分钟
604
匆匆忙忙中新的一年到来,忽然有所感受,回首过去如果能够有所告别或者总结的事情那当然是最好的。人这一生总要做点有意义的事情(对他人或对自己有益的事情),也不白白浪费自己来这世界走一遭。
10分钟入门react-写一个todo-list
夕水
1 月 17 日
阅读 14 分钟
647
前言为了入门react,我特意花了10分钟写了一个todo-list,它长这样:我将之拆分成如下模块:图标输入框与添加按钮列表展示待办事项事项索引事项详情编辑与删除这其中还包含了一些隐藏的操作,例如输入待办事项,按下enter键也可以实现编辑或者确定的效果,点击待办事项还可以弹出一个消息提示框,展示待办事项详情,点击删...
useSafeState-保障 React 状态的安全性
夕水
1 月 17 日
阅读 4 分钟
450
摘要:ahooks 是一个可靠的 React Hooks 库。本文将详细介绍 useSafeState 这个 Hook,帮助您理解其工作原理和应用场景。官方地址:ahooks useSafeState
你可能不知道的antd倒计时组件用法
夕水
1 月 17 日
阅读 6 分钟
681
前言ps: 本文使用ant组件库和react技术栈,因此假定你导入了这些依赖包。如果让你实现一个显示当前日期的定时器组件,你会怎么做?如下图所示:初步实现探索碰到这样的需求,你是不是会使用定时器来实现,如下所示: {代码...} 可以看到,我们使用到了useEffect,在里面使用setInterval方法来不停的设置值,从而达到实现定...
Excuse me? 产品让我实现一个值班表
夕水
1 月 17 日
阅读 51 分钟
521
Excuse me? 产品让我实现一个值班表产品经理让我实现一个值班表,然而我找遍了开源项目,都没有找到符合设计的交互需求,没有办法,我只好自己实现了一个值班表。如下图所示:ps: 值班表的实现采用 react.js 技术栈,所以也将以 react.js 为主来讲解。实现模块分析根据交互图,我将整个值班表拆分出了如下模块:标题用户搜...
真是惭愧,直到今天,我才搞懂桶排序算法
夕水
2024-11-16
阅读 5 分钟
7.8k
前言在我重新复习我创建的代码段集合网站,我复习到了桶排序算法的实现,它的代码如下所示: {代码...} 咋一看代码实现思路,我并不是很清楚为什么这样写。我产生了如下几个疑惑点:为什么要取最小值和最大值?Math.floor((max - min) / size) + 1,这是一个公式,代表什么意义?并且这个公式如何得来的?Math.floor((val - ...
100个React最佳实践小技巧
夕水
2024-10-11
阅读 67 分钟
13.7k
在 React 中,每个组件必须返回单个元素。不要将多个元素包装在 <div> 或 <span> 中,而是使用 <Fragment> 来保持 DOM 整洁。
一些react使用小技巧(下)
夕水
2024-10-10
阅读 20 分钟
9.2k
八. 测试 react 代码54. 使用 React 测试库有效地测试你的 React 组件想要测试你的 React 应用吗?请务必使用 @testing-library/react。你可以在此处找到一个最基本的示例。55. React 测试库:使用测试演练场轻松创建测试用例难以决定在测试中使用哪些测试用例?考虑使用测试演练场从组件的 HTML 快速生成测试用例。以下...
深入浅出React中的refs
夕水
2024-09-26
阅读 9 分钟
6k
文章概要:为什么我们需要在 React 中访问 DOM?refs 如何帮助我们实现访问 DOM?什么是 useRef、forwardRef 和 useImperativeHandle 钩子?如何正确使用它们?
一些react使用小技巧(中)
夕水
2024-09-18
阅读 23 分钟
4.6k
以下是个人收集总结的一些使用 react 的小技巧第二篇。五. 高效的状态管理27. 永远不要为可以从其他 state 或 props 派生的值创建新的 statestate 越多 = 麻烦越多。每个 state 都可能触发重新渲染,并使重置 state 变得麻烦。因此,如果可以从 state 或 props 中派生出值,则跳过添加新的 state。不好的做法:filteredU...
一些react使用小技巧(上)
夕水
2024-08-28
阅读 25 分钟
2.6k
在 React 中,每个组件必须返回单个元素。不要将多个元素包装在 <div> 或 <span> 中,而是使用 <Fragment> 来保持 DOM 整洁。
web每日一题(不断更新中)
夕水
2024-08-06
阅读 17 分钟
1.7k
这是一个每天更新一题的文章,欢迎评论区网友提供题目和答案,不断更新中,记录下来,方便学习,参考答案如有问题,敬请批评指正,废话不多说,开始进入正文。
深入浅出JSON.parse
夕水
2024-06-19
阅读 14 分钟
1.8k
众所周知,JSON.parse方法用于将一个json字符串转换成由字符串描述的 JavaScript 值或对象,该方法支持传入2个参数,第一个参数就是需要被转换的json字符串,第二个参数则是一个转换器函数(reviver,也叫还原函数),这个函数会针对每个键/值对都调用一次,这个转换器函数又接受2个参数,第一个参数为转换的每一个属性名,第...
一个小小的需求,竟让我不得不写一个react-simple-jsx解析器
夕水
2024-06-19
阅读 12 分钟
684
事情是这样的,后端返回类似这样的数据格式`cshjdkvghsv<xxx xx='xxx' />sdhjkshfv'<xxx xx='xxx'></xxx>'sdhgjdsk,然后需要前端将字符串中的xxx`解析出来并渲染到页面中,还要保证渲染顺序,其中xxx可能是一个自定义的react组件名,也有可能是一个html元素标签名,而xx则可能是属性名,'xxx'则是属性...
javascript最佳实践
夕水
2024-06-19
阅读 19 分钟
1.4k
编写可维护性高的 JavaScript 代码非常重要,因为大多数开发者在实际开发中都不会从零开始自己写代码,这种场景是很少的,通常都是会去维护别人写的代码,让自己的代码变得容易维护,也可以保证其他开发者能够更好的完成开发工作,也能让自己以后得维护变得更轻松。
2023我的年终总结-很普通的一年
夕水
2023-12-28
阅读 4 分钟
657
本文参与了SegmentFault 思否 2023 年度有奖征文活动,欢迎正在阅读的你也加入。2023 年终总结又是这样匆匆忙忙的度过了一年,今年付出了很多,也收获了不少,接下来,我想盘点一下我今年所做的付出与收获。收集曾经的作品我收集了我曾经写的诗词,小说等作品,虽然写的不怎么样,但也是值得看看,留作纪念,网站地址我...
这么有趣的ts类型,你确定不来看看?
夕水
2023-11-14
阅读 9 分钟
1.4k
观察题目,其实就是将两个联合类型的值组合成接口,其中第一个联合类型的值作为属性,第二个联合类型的值则作为属性值,并且两者的属性顺序是一一对应的。下面跟着我一起来分析,通过这道题,我们能理解到 ts 的不少知识点,不信继续往下看。
隐藏元素 display:none 与 visibility:hidden 的区别你真的知道吗?
夕水
2023-10-30
阅读 5 分钟
3.4k
有关隐藏元素的方式 display: none 与 visibility:hidden 的区别,这可以说是 css 面试题当中最常见的一道题了。相信大多数开发者被问到的第一答案就是:display: none 不占据空间,visibility: hidden 占据空间。但实际上两者之间的区别并不只是不占据空间这么简单,且听我娓娓道来。
有关安卓软键盘遮挡输入框的问题分析及处理方案
夕水
2023-10-26
阅读 4 分钟
1.6k
js没有相关接口可以准确获取安卓手机软键盘的高度,这样也就无法处理当软键盘弹出时,能够将输入框顶上去,并且与软键盘完美的贴合,比如输入框在最底部的场景,此时页面滚动高度不够,因此无法准确的滚动到底,使得软键盘将输入框顶上去并与之完美的贴合。
难以置信,一个小小的需求让我捣鼓出一个提效的网站来
夕水
2023-10-24
阅读 16 分钟
1.3k
事情是这样的,有个群友在业务当中碰到一个小小的需求,需求是这样的: 页面当中存在多个输入框,输入框的 value 值是一个数值组成的字符串(盲猜应该是身份证号码),这个字符串的位数是 15 位或者是 18 位,例如:'621848063680370'(15 位)和'621848063688370808'(18 位),然后默认的值是这样的,现在问题来了,需求希望...
ew-message 一个基于typescript封装的消息提示框插件
夕水
2023-10-04
阅读 9 分钟
844
ew-message一个基于 typescript 而封装的消息提示框插件,可用于不使用ui组件库的中小型网站中。安装与使用安装 {代码...} 引入 {代码...} 消息提示框插件如下: {代码...} option 配置对象有如下参数: {代码...} ps: 推荐使用导入样式文件的方式。cdn 引入 {代码...} 在组件中使用 {代码...} 当然也可以不引入样式,插件...
奇怪,奇怪,真的好奇怪的javascript
夕水
2023-09-07
阅读 4 分钟
1.4k
问题很简单,先使用 let 在全局中定义了一个变量 a,并定义初始值为 1,然后定义了一个函数,在函数的内部又定义了一个同样的变量 a,然后调用这个函数,在调用函数之后打印变量 a,问题就是在函数内部添加一些代码使得最终打印变量 a 的结果是 3。
作兔器——手写一个可爱的兔兔相册展示器
夕水
2023-09-06
阅读 11 分钟
4.3k
自译: 兔年既然来了,为了表示欢迎兔年的到来,而且我也认为兔兔很是可爱,令人喜欢,因此写了一个兔兔相册展示器,用来收藏可爱的兔兔图片,现在让我们先来看看这个相册展示器的效果吧,正如下面所展示的:
1
(current)
2
3
下一页
1
(current)
下一页