记录--elementui源码学习之仿写一个el-button
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 本篇文章记录仿写一个el-button组件细节，从而有助于大家更好理解饿了么ui对应组件具体工作细节。本文是elementui源码学习仿写系列的又一篇文章，后续空闲了会不断更新并仿写其他组件。源码在github上，大家可以拉下来，npm ...
react组件中方法调用
我们在初学react时(有vue等其他基础)，我们在方法调用的时候通常是 方法名() 例如： import React from 'react' function test() { console.log('这是测试') } export default class Login extends Re ...
创建型-单例模式
什么是单例模式 单例模式 （Singleton Pattern）又称为单体模式，保证一个类只有一个实例，并提供一个访问它的全局访问点。也就是说，第二次使用同一个类创建新对象的时候，应该得到与第一次创建的对象完全相同的对象。 简单的说就是保证一个类仅有一个实例，并提供一个访问它的全局访问点，这样的模式 ...
monorepo实践：yarn workspace + vite + typescript + react
前言 最近需要用到多包管理 monorepo 开发新项目，所以提前预研一下项目搭建。 monorepo(monolithic repository)是一种项目架构，就是用一个仓库管理多个项目（应用，库），react和babel的源码仓库都是用这种方式在管理。 优缺点略过，可以参考：精读《Monore ...
如何在新的电脑中编辑现有的github仓库内代码？
首先，我们创建一个文件夹。 创建完这个文件夹以后，点开里面是空的。然后我们点进去，右键Git Bash Here, 打开我们的github 把这个链接复制一下，在git bash 中输入： git clone +链接 这个时候我们会发现原本的那个代码文件实际上已经被存放到我们的电脑中了。 然后我们在 ...
CSS渐进增强方案
首先需要明确一点，以往浏览器对css的支持是不同的，不同浏览器的样式可能会存在差异，对待这种差异问题，需要写几套不同的css来兼容（边框、圆角、颜色等），这样是非常麻烦的，浏览器css显示差异化属于浏览器自身的问题，跟我们的css是没有关系的，好的浏览器就有好的显示，糟糕的浏览器就只有普通显示，我们 ...
创建型：工厂模式-工厂方法、抽象工厂
简单工厂问题 简单工厂中我们通过参数来返回不同的产品对象，如果管理的对象过多，这个工厂函数会比较庞大，且当我们需要增加一个新的产品时，需要修改这个工厂方法，违反开闭原则（对拓展开放，对修改关闭）。 为了解决简单工厂模式的问题，出现了工厂方法模式。 解决简单工厂思路 简单工厂类图关系类似如下： 如上图 ...
从0搭建Vue3组件库(五): 如何使用Vite打包组件库
本篇文章将介绍如何使用 vite 打包我们的组件库,同时告诉大家如何使用插件让打包后的文件自动生成声明文件(*.d.ts) 打包配置 vite 专门提供了库模式的打包方式,配置其实非常简单,首先全局安装 vite 以及@vitejs/plugin-vue pnpm add vite @vitejs/ ...
【备战面试】JavaScript 进阶问题列表
在原博主Instagram 上每天都会发布 JavaScript 的多选问题，并且同时也会在这个仓库中发布。 从基础到进阶，测试你有多了解 JavaScript，刷新你的知识，或者帮助你的 coding 面试！ :muscle: :rocket: 博主每周都会在这个仓库下更新新的问题。 答案在问题下 ...
前端设计模式——单例模式
单例模式是一种设计模式，它可以确保某个类只有一个实例，并提供一个全局的访问点来访问该实例，我们可以使用单例模式来管理全局状态和共享资源。 在JavaScript中，单例模式可以通过多种方式实现，以下是一些常见的实现方式： 1. 对象字面量 使用对象字面量可以轻松地创建单例对象，例如： const s ...
巧用 CSS 变量，实现动画函数复用，制作高级感拉满的网格动画
本文将介绍一种基于 CSS 变量技巧，通过合理使用 CSS 变量，实现 CSS 动画 @keyframes 的复用。 CSS 变量 CSS 变量大家应该都比较熟悉了，已经不能算是新知识了，快速过一遍。 CSS 变量（CSS Variable），在之前也叫做 CSS 自定义属性，其使用方式如下： // ...
vue 组件的引用
一:全局引用 1,现在main中引用组件: import 组件别名 from '组件路径' 2.注册组件 Vue.component('组件别名', 组件别名) 1.在需要引用组件的页面中script下写如下代码 import 组件别名 from "组件路径"; 2.注册组件 components: ...