自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(16)
  • 收藏
  • 关注

原创 前端javascript计算精度问题怎么解决?a-calc

大家好,我是木瓜太香,做前端开发经常会遇到数字计算精度丢失的问题,和数字格式化的麻烦问题,好不容易找到了可以解决这些问题的库结果用起来不够方便,例如 bignumber.js decimal.js 等编写体验不好,这篇文章来帮助你完美解决这些问题。

2024-03-07 11:43:20 902 1

原创 web前端精度丢失前端精度计算彻底解决

大家好,我是木瓜太香,做前端开发经常会遇到数字计算精度丢失的问题,和数字格式化的麻烦问题,好不容易找到了可以解决这些问题的库结果用起来不够方便,例如 bignumber.js decimal.js 等编写体验不好,这篇文章来帮助你完美解决这些问题。

2024-03-07 11:38:15 572 1

原创 vue-best-verify最好的vue表单验证库,用起来有多爽?

表单验证在前端项目中是一个常见场景,但是我们常用的UI库中自带的表单组件全部都非常难用,代码量大,API记忆量大,编写复杂,设计不够简洁,但似乎大家对这种开发体验也都习以为常,变得麻木了,然而今天带来的 vue-best-verify 则是一个完美主义的表单验证库,相信能带你打开新世界的大门。

2023-10-25 11:13:56 407 1

原创 a-calc前端精度问题的终极解决方案,计算不准不方便就用它!

大家好,我是木瓜太香,做前端开发经常会遇到数字计算精度丢失的问题,和数字格式化的麻烦问题,好不容易找到了可以解决这些问题的库结果用起来不够方便,例如 bignumber.js decimal.js 等编写体验不好,这篇文章来帮助你完美解决这些问题。

2023-10-25 11:01:05 181 1

原创 如何完美解决前端数字计算精度丢失与数字格式化问题?

大家好,我是木瓜太香,做前端开发经常会遇到数字计算精度丢失的问题,和数字格式化的麻烦问题,好不容易找到了可以解决这些问题的库结果用起来不够方便,例如 bignumber.js decimal.js 等编写体验不好,这篇文章来帮助你完美解决这些问题。

2023-07-14 14:25:28 414 1

原创 vue任意关系组件通信与跨组件监听状态 vue-communication

大家好!我是木瓜太香!众所周知,组件式开发方式给我们带来了方便,不过也引入了新的问题,组件之间的数据就像被一道无形的墙隔开,如果我们希望临时让两个组件直接通信,vuex 太巨,而 $emit 又不好维护 provider 不可控 这个时候就该今天的主角 vue-communication 登场了! vue-communication介绍他是一个可观测可调试的vue组件通信方案任意关系组件可直接通信支持跨组件监听数据变化支持发送离线数据安装yarn add vue-communicat.

2020-10-18 14:49:32 779

原创 vue父子组件状态同步的最佳方式续章(v-model篇)

大家好!我是木瓜太香!一名前端工程师,之前写过一篇《vue父子组件状态同步的最佳方式》,这篇文章描述了大多数情况下的父子组件同步的最佳方式,也是被开源中国官方推荐了,在这里表示感谢!这次作为续章是对上一篇文章的特殊情况的补充,并会给出较详细的描述与代码演示,当然如果你单看这篇文章来解决特定问题也是可行的。 对于父子组件状态同步,这篇文章 《vue父子组件状态同步的最佳方式》 讲述了大多数情况下的最优解,但是当我们希望自己创建的可复用组件和封装的逻辑能够尽量行为一致的时候情况可能会有所不同,举个例子,.

2020-09-15 22:48:22 294

原创 webstorm中emmet展开a标签和行内元素不换行的解决办法

大家好我是木瓜太香,大家在使用 webstorm 编写 html 的时候可能会遇到展开部分标签挨在一起的情况,相信很多小伙伴都想解决这个问题,接下来我们就开始吧!先来看看我们输入如下 emmet 代码的时候展开的效果是怎么样的div>a*3展开效果:这个时候我们可能需要自己去一个一个回车排版,当然这肯定不是你想要的,现在我们来解决这个问题。在解决问题之前,我们要知道产生这个问题的原因,在 webstorm 中是对标签进行分类的,其实从逻辑上来说,a 标签这种本身就属于行内标签,不换行在.

2020-09-13 19:09:55 798 1

原创 深入理解 vue 中 scoped 样式作用域的规则

哈喽!大家好!我是木瓜太香,今天我们来聊一个 vue 的样式作用域的问题,通常我们开发项目的时候是要在 style 上加上 scoped 来起到规定组件作用域的效果的,所以了解他们的规则也是很有必要的,可以让你更清晰的了解你的项目样式是怎么运作的。先来说说实现方式vue中的样式作用域是通过属性选择器来实现的,例如同样一个类名,我们是通过 .类名[属性名] 来做区分的,我们这里主要是要搞清楚这里的属性名是怎么分配的。样式作用域规则接下来我们分情况来说一下样式作用域:对于有样式作用域的组件,该组.

2020-09-12 12:26:41 510

原创 javascript事件环微任务和宏任务队列原理

哈喽!大家好!我是木瓜太香,我又来嘞,今天来说说前端面试中经常别问到的 JS 事件环问题。JS 事件环JS 程序的运行是离不开事件环机制的,这个机制保证在发生某些事情的时候我们有机会执行一个我们事先预定好的函数,事情发生的时候 JS 会将相应的函数入栈执行然后出栈,但是关于事件环我们还有一些未知的东西,例如,setTimeout 我们习惯称他为定时器,但是可能很多人没有意识到,这个东西和我们常用的一些事件没什么不同,只不过我们通常所说的事件大多需要用户触发,而 setTimeout 不用用户自己触发.

2020-09-10 22:44:48 246

原创 webstorm单标签设置成双标签展开解决iview中col展开问题

大家好!我是木瓜太香,今天给大家带来一个 webstorm 小技巧场景:有使用过 vue 框架并且使用 iview 做 ui webstorm 做 ide 的同学,可能会遇到一个比较奇怪的问题,iview 中有一个 Col 的组件,这个组件作为一个布局组件存在,但是他和 html 原生标签 col 重复了,iview 中 Col 需要是双标签,原生 html 中 col 是单标签,webstorm 就会认为他是单标签,在展开的时候也就只是单标签了。解决的办法其实比较简单,我们可以在 webstorm.

2020-09-10 22:17:26 447

原创 vue父子组件状态同步的最佳方式

哈喽!大家好!我是木瓜太香,一位老牌儿前端工程师,平时我们在使用 vue 开发的时候,可能会遇到需要父组件与子组件某个状态需要同步的情况,通常这个是因为我们封装组件的时候有一个相同的状态外面要用,里面也要用,今天我们就来看看怎么优雅的解决这个问题吧!一般来说我们实现这个功能,只需要父组件通过 props 传递给子组件就好了,但是理想很丰满,现实很骨感,如果我们直接在子组件更改传进来的 props ,不出意外浏览器会给你一坨大红色的报错,因为在 vue 中我们的数据流动是自上而下的,而子组件直接更改父组.

2020-09-09 23:26:43 385

原创 webstorm编写vue、react 将大驼峰组件命名转换成短横杠命名

大家好!我是木瓜太香,精通 webstorm 与常见前端技术的工程师,偶尔也在b站搞一些 webstorm 技巧教学,今天给大家带来的是大驼峰小驼峰快速转换短横杠命名或者下划线命名的方式。开发中我们可能会遇到一个这样的需求,我们在创建组件的时候习惯使用大驼峰命名,而在使用的时候,我们又要使用短横杠或者下划线命名,这种功能我们当然不可能手打的啦,这辈子都不可能的啦。解决的办法一般比较容易想到的有两种,一种是直接使用插件实现,另一种则是使用宏命令来实现,两种都是可以完成这个操作的,只是第二种更加考验大家.

2020-09-08 22:23:58 1399

原创 vue、react等SPA应用页脚组件闪烁的解决办法

大家好,我是木瓜太香。大家在开发单页应用的时候,经常会遇到这样的需求,头部和尾部两个组件是大多数组件公用的,而中间的内容区域则是单独存在的,而且一般内容组件逻辑会比较多,如果我们不停刷新页面可能会出现尾部组件闪烁的问题。这个问题的出现主要是因为,内容区组件要比尾部组件大,而且尾部组件一般是没有什么逻辑的,相当于一个静态组件。解决这个问题的思路就是想办法在页面最开始加载的时候隐藏尾部组件,之后再合适的时候将尾部组件显示出来即可。说一下公司项目(VUE)中的解决办法,我们的思路是,先让尾部组件固定定位.

2020-09-07 20:30:28 314

原创 webstorm中emmet展开a标签和行内元素不换行的解决办法

大家好我是木瓜太香,大家在使用 webstorm 编写 html 的时候可能会遇到展开部分标签挨在一起的情况,相信很多小伙伴都想解决这个问题,接下来我们就开始吧!先来看看我们输入如下 emmet 代码的时候展开的效果是怎么样的div>a*3展开效果:这个时候我们可能需要自己去一个一个回车排版,当然这肯定不是你想要的,现在我们来解决这个问题。在解决问题之前,我们要知道产生这个问题的原因,在 webstorm 中是对标签进行分类的,其实从逻辑上来说,a 标签这种本身就属于行内标签,不换行在.

2020-09-06 22:26:31 1374

原创 DOM监控 MutationObserver | 木瓜太香

DOM监控 MutationObserver大家好!我是木瓜太香,一个传播webstorm使用技巧的前端工程师,这一次给大家带来的是 DOM 监控的方法。MutationObserver接口提供了监视DOM树更改的能力,是旧的 Mutation 的替代品使用方式:通过 MutationObserver构造函数创建对象 ob,该对象下有以下可用方法observe(dom对象,option) :配置MutationObserver在DOM更改匹配给定选项时,通过其回调函数开始接受通知discon

2020-09-06 01:18:59 887

空空如也

空空如也

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

TA关注的人

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