孟余的博客 | My Blog

uniapp 主题切换的实践

如何更方便的实现uniapp-小程序的主题切换？

前言「主题切换」在我的认知里有两种方法，一是使用类名，二是自定义变量。类名即 .light 和 .dark 是不同颜色的两套样式文件，根据当前的主题，给根元素添加对应的类名。自定义变量即声明自定义变量，在「style」中直接使用自定义变量。我更加青睐于「自定义变量」，在网页端的项目里，曾有过实践。网页端主...

Posted by My on February 11, 2025

h5页面加载更多的实践

上拉加载更多是用UI库，还是自己封装？

前言在 h5 页面中，列表页是需要有分页效果的，最常见的就是使用上拉加载功能，那就近正好遇到了，那基于这个需求，就来分析一下如何实现这个功能。那目前，整个页面含有几个组件，细的就不说，主要是整个页面框架和「上拉加载」组件。基本的内容准备 UI 效果是这样的：基于此，要实现上拉加载，得先有这个页面的容器和数据的请求接口，下面就针对这些进行分析。页面框架页面框架是基于 ...

Posted by My on April 10, 2024

关于 Vue 响应式原理的思考

什么是响应式？谁和谁之间的关系？

前言响应式最直观的解释就是：数据变化时，视图会自动更新，也就是「数据驱动视图」。换一句话说，响应式里的关系是「数据」和「视图」之间的关系。视图什么是视图？应该是用户看到的页面，也确实如此。但是，在计算机里，并没有所谓的「页面」。在「web」中，我们看到视图，就是 dom 元素，不仅如此，页面上的数字，文字也是视图的一部分。在 vue 中，是使用虚拟 dom 来映射成 do...

Posted by My on July 21, 2023

Parameter Normalization

How to normalize parameters

参数归一化（Parameter Normalization）是一种在处理数据时常用的技术，旨在将不同范围或不同单位的数据转换为一个统一的标准，使其在分析和建模时更加有效和一致。那在软件开发中如何实现参数归一化呢？比如说有一个函数，功能很简单，把传入的一个日期进行格式化，返回一个字符串。 1 2 3 4 5 6 7 /** * @description 格式化日期 * @param ...

Posted by My on July 10, 2023

幻影依赖

what are phantom dependencies?

慢慢地，放弃了使用 npm 作为包管理工具，转而使用 pnpm 作为包管理工具。其中一个原因就是 npm 存在幻影依赖问题。什么是幻影依赖？幻影依赖是指，在项目中，某个依赖包的版本号被锁定，但实际上该依赖包的依赖版本号并没有被锁定，导致项目中存在多个版本的依赖包。通俗的讲，当你只安装了依赖 A ，但实际上会安装很多依赖（查看 node_modules 目录）。因为里面存在...

Posted by My on June 1, 2023

debounce and throttle

对防抖和节流的简单理解

「防抖」和「节流」或多或少在项目中都会使用，技术并不是很复杂，主要是「设计思路」和对函数的理解与运用。防抖「防抖」是指在一个函数被多次调用时，只有在停止调用一段时间后才会执行，也就是说，函数在被调用时，会将之前的调用记录下来，如果在这段时间内又被调用，则会将之前的调用清除，只执行最后一次调用。举个例子：就像是电梯门，如果电梯门即将关闭，这时候你按下了开门按钮，电梯就会重置关门时间...

Posted by My on August 1, 2022

webpack 优化

使用webpack可以进行哪些简单的优化？

前言对于前端性能优化，大致可以分为「浏览器部分」和「代码部分」。其中代码部分又可以分为「构建优化」和「代码优化」。「代码优化」理解起来就是代码的规范了，比如减少无用的注释，减少代码的复杂度，使用更高效的算法，删除无用的文件和代码等等。「构建优化」则是指 webpack 的配置优化，比如减少 bundle 大小，提升构建速度，使用更好的压缩算法等等。本文将介绍 webpack 优化的一...

Posted by My on July 18, 2022

Cross-domain

What is cross-domain and how to solve it?

前言「跨域」是个基础又严重的问题，但是在现代前端开发中，并没有多少人真正意识到它的存在。比如 Vue 项目，脚手架搭建起来后，配置了几个参数，就可以正常使用了。至于为什么能正常使用，里面有没有跨域问题，就没有深入的去了解过，甚至什么是跨域，都很难说清楚。 1 2 3 4 5 <script> fetch('https://pvp.qq.com/web201605...

Posted by My on July 15, 2022

MVVM && MVC

What are mvvm and mvc, and what are their differences?

MVVM（Model-View-ViewModel）和 MVC（Model-View-Controller）是两种常见的设计模式，它们都用于分离应用程序的逻辑、视图和数据， MVVM 「MVVM」（Model-View-ViewModel）是一种软件架构模式，用于分离应用程序的 UI「view」、业务逻辑「model」和界面逻辑「viewmodel」。它在设计模式中被广泛用于构建响应...

Posted by My on July 9, 2022

Array Types

How to determine whether a variable is an array ?

在做一些数组相关的操作时，我们经常会遇到判断一个变量是否为数组的问题。下面简单记录几种常见的判断数组的方法。对象原型上的方法 Object.prototype.toString.call() 方法可以用来判断变量的类型。判断数组 1 Object.prototype.toString.call([]); // [object Array] ...

Posted by My on June 30, 2022

My Blog