今天我中遇到了一个这样的场景，发现触发复用的自定义组件中添加了防抖的函数，发现只执行了一次，并没有如预期的那样每个组件内的函数都执行一次。

一开始以为是没有同步赋值，检查了一下没问题，才把关注点转移到 debounce 上面。移除防抖之后果然解决问题了，但防抖又不能去去掉。

所以查了一下相关的问题，发现是因为多个组件实例是共享同一个预置防抖的函数，并不是相互独立的。

今天在逛V站看到一个自推UI组件库的帖子，我觉得很不错，在查看组件样例的时候呢，发现了他的抽屉组件的遮罩可以把整个页面添加毛玻璃效果！我就很惊讶。马上就 F12查看了一下他的实现方式，因为在我映像里还没有一个很简单的的可以直接实现背景元素毛玻璃效果的方式。

其实不光是抽屉组件，其它的一些类 Modal 带有遮罩的组件都有这个毛玻璃的效果，大伙可以点点看看。

好了，不多废话直接开始正题。

本周来了一个新的需求，需要前端生成打印内容，每一项数据占据一张 A4 纸，选择多项就是分多张打印，所以需要打印指定内容区域，并且使用 page-break 来控制打印区域的分页。
以前就只使用 CSS 控制过打印时样式，隐藏一些不需要打印的区域，还尝没有试过打印指定区域内容，并且控制打印内容强制分页，所以记录一下。

最近有一个项目，我发现有一些表单内容高度重复的情况，几张页面的表单虽有些细微差，但还是有很多同样的表单内容，或者 表单域A 和 表单域B 同时出现在一个页面中的这种情况。

我就想着能不能把他们都提出来，单独的做成组件在再使用到这些内容的时直接引入对应的表单域组件，并且可以把下拉菜单的远程查询也放到组件中，这样就会精简点很多重复的代码。

以前因为项目需要 i18n ，一直以来都是自己写了一个格式化函数来处理，会使用 replace 配合正则对数字进行千位分割来展示，并且搭配 Vue.filter 来实现快速格式化。
但是对于大位数处理就会比较麻烦了，因为在境内就需要使用 万位分割，大位数使用 万、亿、万亿 来缩，而在英语系国家就会使用 千分分隔，比如说: K、M、B 来缩写数额。

正巧最近开始了一个需要国际化的项目，在一开始编写数字格式化过滤器的时候偶尔发现了 Intl.NumberFormat().format() 这个API，原来现在 原生JS就支持了对数字的格式化，并且不光可以千位分隔，还可以将大位数缩写。

嗨呀，我也开始写 uni-app 了 😂，这次在使用 uView 这个UI库的时候遇到了一个问题，就是 <u-icon> 组件使用 @click.stop 阻止冒泡事件使会提示异常：TypeError: e.stopPropagation is not a function

去看了一下组件的源码，发现 u-icon 组件的 click 事件是自定义事件，没有 event，只返回了一个 this.index，所以不能使用 .stop 来阻止冒泡，

在日常项目中经常会遇到需要对字符串补位的操作，比如

• 向前补0：例如日期，经常会需要YYYY-MM-DD 的格式，
  如果不使用日期库，直接获取月份和日期前面是没有0的，需要手动拼接字符串。

正巧今天要搞日历组件，前面缺一个0总感觉少了点感觉，当时懒得自己写补全了，想着百度一个吧，就搜到了张鑫旭大佬的这篇文章 《JS字符串补全方法padStart()和padEnd()简介》，然后就惊了，原来早在4年前 JS 就原生支持了前后补全了（我这几年在干嘛😢）

面试的时候也算是进场会遇到的一个题目了，结论就是 可以也不可以，看原始数据是什么结构的，也看你如何是操作的。

如果说数组元素是基本类型的，比如说是数字类型、字符串、布尔类型的，那么不管是用 .map() 还是 .forEach() 都是无法修改原数组的。
如果说是集合类型的，比如说数组、对象，那么直接操作内部的元素或者属性都是会修改原数组的。

重排会导致重绘，重绘不会导致重排 。

中文环境下面的 重排 会有另外一种称呼方式叫做 回流。以前一直不理解为什么重排叫回流（直译的 reflow），导致我在记忆的过程中我总是会把他们混在一起，分不清回流是重排还是重绘。

他们对应的含义我倒是分的还是比较清楚的。简单来说就是，牵扯页面布局的页面更新是重排，重绘就只是一些不影响布局的样式更新……

也算是经典面试题的一部分了，对于父子间的通讯很多时候的使用我都是限于 props/$emit 来处理，或者 Vuex/EventBus 这种方式，很少会用到 Provide/Inject 来处理。其实这是一个很实用的跨级组件间通讯的方式。

这对选项需要一起使用，以允许一个祖先组件向其所有子孙后代注入一个依赖，不论组件层次有多深，并在其上下游关系成立的时间里始终生效。

看文档中关于这对API的解释就可以看到，向其所有后代 注入一个依赖，所以在跨级组件间通讯，或者 单父多子组件间通讯就会很方便了。

简单的使用可以查看官方文档中的示例，我就不举例了，因为使用起来真的很简单。

最直白的（但是错误的）可以理解为 props 的强化版本，暴露一个可以无视子组件的嵌套层级属性来进行注入。