📢前言代码取自开源项目50projects50days，用作个人学习和巩固三件套的知识，增加了注释，可能会有小改动。
在线演示地址
📝实现思路及效果
💻代码index.html1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>导航栏最小化</title&g ...
📢前言代码取自开源项目50projects50days，用作个人学习和巩固三件套的知识，增加了注释，可能会有小改动。
在线演示地址
📝实现思路及效果
💻代码index.html12345678910111213141516171819202122232425262728293031323334353637<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>倒计时动画</title> <link rel="sh ...
📢前言代码取自开源项目50projects50days，用作个人学习和巩固三件套的知识，增加了注释，可能会有小改动。
在线演示地址
📝实现思路及效果
💻代码index.html12345678910111213141516171819202122232425262728293031<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>3d盒子背景</title> <!-- 引入一个字体样式 并检验是否安全 ...
前言马上要秋招了，搜集整理了一些Vue面试题，包括组件、指令、API等相关内容，巩固基础😎秋招冲冲冲！！！本篇包括：
✅keep-alive的理解✅nextTick的理解✅vue组件之间的通信方式✅Vuex的理解及使用场景
keep-alive的理解
Props：
include - string | RegExp | Array。只有名称匹配的组件会被缓存。
exclude - string | RegExp | Array。任何名称匹配的组件都不会被缓存。
max - number | string。最多可以缓存多少组件实例。
用法：
<keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 <transition> 相似，<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在组件的父组件链中。
当组件在 <keep-alive> 内被切换时，它的 mounted 和 unmounted 生命周期钩子不会被调用，取而代之的是 activated 和 deactiva ...
前言马上要秋招了，搜集整理了一些Vue面试题，包括组件、指令、API等相关内容，巩固基础😎秋招冲冲冲！！！本篇包括：
✅计算属性和侦听器的区别✅事件修饰符✅单页应用(SPA) VS 多页应用(MPA)✅如何解决SPA首屏加载速度慢✅v-if和v-for的优先级
计算属性和侦听器的区别计算属性(computed)是自动监听依赖值的变化，从而动态返回内容(动态显示新的计算结果)。
监听(watch)是一个过程，在监听的值变化时，可以触发一个回调，并做一些事情。回调函数有两个参数，一个 val （修改后的 data数据），一个 oldVal（原来的 data 数据）。Vue 实例将会在实例化时调用$watch()，遍历 watch对象的每一个属性。
两者用于不同情况下完成计算，显示数据的操作。它们的区别主要来源于用法，只是需要动态值，那就用计算属性；需要知道值的改变后执行业务逻辑，才用 watch，用反或混用虽然可行，但都是不正确的用法。
下面给出这两个特性的基本用法：
计算属性
12345678910111213141516<div id="app"> & ...
前言本篇博客内容来源于B站视频-up主耐心的钠珀学长，部分内容结合博主个人经历：
高中和大学最显著的三大区别。我一个个和你讲清楚。我回想一下，如果是我刚高考完，甚至到大二，我可能都看不懂这个视频，因为真的有点超越我当时的认知水平。但是回过头来看，如果说我不在大学里面被打肿，不迷茫个一年半载，🤡我根本不可能想通这些问题。
公平与对错高中分对错，讲公平；大学没有对错，别讲公平。
中学时，同学之间告状的对象是老师，内容无非是：谁抄了谁谁谁的作业；老师谁谁上课总说话，都是这些破事。但是上了大学之后，我才知道：原来大部分的人都在抄，从小测到作业、上机，甚至是考试；大家上课也没有认真听讲，基本都在睡觉、玩手机。原来励志奖学金也有很大一部分都设置给了家境本来就很好的同学。
当我们还在讲对错，讲公平的时候，别人的各种骚操作直接把我们秀翻了呀。当我们会意识到这一点的时候，心态可能就直接崩了。举个例子，大家请跟我思路听一下是不是这个道理：如果说你在玩一场必须要玩下去的游戏，开局了大概一会儿之后，你发现这个游戏百分之三十的玩家都在开挂，他们一开局血量都是满，金币都是无限的，装备都是从父母那边继承管的。
...
前言马上要秋招了，搜集整理了一些Vue面试题，包括组件、指令、API等相关内容，巩固基础😎秋招冲冲冲！！！本篇包括：
✅ webpack和vite的对比✅ v-if和v-show的区别✅ 绑定class的数组用法✅ 组件中data为什么是函数✅ 生命周期
Webpack 和 Vite对比
vite凭什么比webpack快
webpack启动需要打包
webpack dev serve在启动时，会把所有的包都build一遍，从入口文件起索引整个项目的文件，编译成一个或多个js文件，不管模块是否被执行，都会被打包到bundler里。随着项目的复杂程度上升，模块增加，打包后的bundler也会越来越大，打包速度会越来越慢。即项目越复杂，启动时间越来越长。
Vite在启动时不需要打包，不需要拆分模块的依赖，不需要编译，启动速度非常快。
由于现代浏览器本身就支持ES Module，会自动向依赖的Module发出请求。vite充分利用这一点，将开发环境下的模块文件，就作为浏览器要执行的文件，而不是像webpack那样进行打包合并。
vite 请求哪个模块再对该模块进行实时编译 webpack全 ...
📢前言代码取自开源项目50projects50days，用作个人学习和巩固三件套的知识，增加了注释，可能会有小改动。
在线演示地址
📝实现思路及效果
注意一下几点：
各元素的位置与显示格式，尤其是对于justify-content，属性值为flex-start还是center
生成密码内容的位置不要先入为主想成input
calc的用法，详情见代码注释
监听固定的几个按钮（复制、生成、5项规则），使用Math.random()生成所需字符，构建密码
复制原理的实现：将生成的字符串放置到新创建的textarea中，使用select()选中该区域的文本，使用copy命令复制成功后，将创建的textarea移除
💻代码index.html123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657<!DOCTYPE html><html lang="en"><head> & ...
