前端笔记（一）

computed和watch的对比

Computed	Watch
计算属性	监听属性
支持缓存	不支持缓存
不支持异步	支持异步
依赖数据发生变化时，重新计算	数据发生变化时，执行函数
一个值受多个属性影响	一条数据影响多条数据
必须return返回数据

v -if 和 v - show 的区别 

v -if	v - show
条件渲染	控制元素的 display 属性
当元素隐藏时，会在DOM节点中把该元素移除	当元素隐藏时，会在DOM节点中把该元素CSS属性设置为display : none元素依然保留在 DOM节点中
更高的切换开销	更高的初始化渲染开销
如果需要频繁的切换用v - show 比较好，如果条件很少改变，则使用 v - if 较好。

Element-UI table组件动态合并行 

表格渲染数据时，相同tag_name合并行即根据tag_name的数量动态的合并行。

需求效果：

日期	标签	品类	数量
2022-04	木	手链	1
		吊坠	1
	银	手链	1
		吊坠	2
		项链	2

 

如何控制node版本 

使用nvm控制版本（在nvm中下载node）

下载地址：https://github.com/coreybutler/nvm-windows/releases

查看可安装版本：nvm list [available]

下载安装node：nvm install 11.13.0

使用：nvm use [版本号] [32/64]

卸载：nvm uninstall 11.13.0

Key的作用

使用v-for时都需要加上key作为唯一标识，加key除了可以提高渲染性能，还能避免数据混乱的情况出现。设定key时最好使用数据唯一值（id）,尽量不使用index。用index作为key时，若在第二条插入一条数据，则除了第一个数据可以复用之前的之外,另外三条数据都需要重新渲染。用id（数据唯一值）作为key时，若在第二条插入一条数据，则除了新插入的那条数据需要渲染，其他数据都可以复用之前。