My Blog

「黎明到来之前都是黑暗的」

web 国际化语言配置

vue开发中国际化的一些方法

一、国际化 其实,我们平常说的 「国际化」配置,也就是语言配置而已,不包括地区的宗教信仰、生活习惯等等。而语言配置,一般都是结合文件,使用变量替换的方式实现的,我相信很多人也都做过 「国际化」,都有一定的经验。 二、切换方案 目前,我所了解到的方案有以下三种: 本地缓存: 点击「切换」按钮后,将当前的语言,如 en 缓存到本地,下次打开页面时,直接读取缓存的...

element-ui 上传文件

上传文件前的限制为什么会删除列表中的文件?

问题描述 之前使用 element-ui 上传文件时,也仅涉及到上传「单个」文件,也经常在 before-upload 钩子中限制文件类型和大小,没出现什么问题。但是这次需求需要上传「多个」文件,并且限制文件类型和大小,如果按照之前的做法,校验不通过时,返回 false,那已经上传的文件就会被删除。对了,使用的是文件列表展示,结构如下: 1 2 3 4 5 6 7 8 9 10 11 1...

关于 Vue 响应式原理的思考

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

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

Parameter Normalization

How to normalize parameters

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

幻影依赖

what are phantom dependencies?

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

debounce and throttle

对防抖和节流的简单理解

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

webpack 优化

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

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

Cross-domain

What is cross-domain and how to solve it?

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

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」。 它在设计模式中被广泛用于构建响应...

Array Types

How to determine whether a variable is an array ?

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