持续更新

字数: 0 字 时长: 0 分钟

模态对话框

模态对话框要求用户必须立即进行操作。这意味着在用户对其做出回应之前，不能继续使用应用程序。（危险操作） 非模态对话框允许用户不间断地继续使用应用程序。非模态元素的一个常见示例是显示在屏幕一角的 toast 消息，它不需要用户执行任何操作即可继续使用该应用程序。

npx 与 npm

npx 没更新的烦恼（？？）

min.js

代码简版

a-select

label in value 属性同时获取显示值和实际值

key 要唯一性！！！

公司里很多人用 index 作为 key，为什么不好？（重新渲染）

v-for 遍历避免同时使用 v-if

为什么？顺序是什么样？在 vue2 与 vue3 优先级不一样，是怎么样的？(vue2 v-for 高，先遍历生成虚拟 dom，再判断是否渲染) 会多渲染

a-select 默认值

如果在 data return 里写死 defaultValue 的参数，没有“选中”这个效果，得写成变量绑定。 vue 组件初始化会先检查 v-modal 绑定的变量，并将其值与组件的内部状态同步。如果组件初始化之前被设置，同步过程可能不会立即发生，导致初始状态不对（没有“选中”这个态）

图片懒加载

1.监听高度 2.IntersectionObserver 3.loading

箭头函数

消除函数的二义性

空合并操作符

假 (false) 和 假值(falsy)

// 1. 使用 0 作为输入
const a = 0;
console.log(`a || 10 = ${a || 10}`); // a || 10 = 10
console.log(`a ?? 10 = ${a ?? 10}`); // a ?? 10 = 0

// 2. 空字符串 '' 作为输入
const a = "";
console.log(`a || "ABC" = ${a || "ABC"}`); // a || "ABC" = ABC
console.log(`a ?? "ABC" = ${a ?? "ABC"}`); // a ?? "ABC" =

// 3. 使用 null 作为输入
const a = null;
console.log(`a || 10 = ${a || 10}`); // a || 10 = 10v
console.log(`a ?? 10 = ${a ?? 10}`); // a ?? 10 = 10

// 4. 使用 undefined 作为输入
const a = { name: "" };

console.log(`a.name ?? 'varun 1' = ${a.name ?? "varun 1"}`);
console.log(`a.name || 'varun 2' = ${a.name || "varun 2"}`);
// a.name ?? 'varun 1' =
// a.name || 'varun 2' = varun 2

// 5. 使用 false 作为输入
const a = false;
console.log(`a || 10 = ${a || 10}`); // a || 10 = 10
console.log(`a ?? 10 = ${a ?? 10}`); // a ?? 10 = false

懒加载

<img loading="lazy" />//默认为eager,立刻

chrome 调试

声明式框架与命令式框架,为什么 vue 比 jQuery 更好

vue SFC

"以 Vue 为例，通常可以选择使用 Vue SFC 形式编写组件代码" Vue Single File Component 的缩写，指的是 Vue.js 的单文件组件

协同编辑

协同编辑：YJS

画布协同：对同步节点的要求更高，低代码相关

利用 nginx 判断登录方是 PC 还是 H5

使用 CSS content-visibility 提高渲染性能：

使用 CSS content-visibility 提高渲染性能

使用 content-visibility 优化渲染性能
https://juejin.cn/post/7108921365628977166

虚拟列表

常用手段，主应用工程选择有。

webpack 与 vite

w: run build 不删除 dist v: run build 删除 dist

英雄区

英雄区（Hero Section）是网站首页最顶部的第一个视觉区域，通常是用户访问网站时最先看到的部分。源自印刷媒体时代的"hero image"（主图）概念。