最近我在收看唐金州在极客时间发布的《vue从入门到精通》,颇有收获。

唐金州,一点资讯前端技术专家,曾在蚂蚁金服就职,也是开源组件库ant design vue的作者,虽然唐老师写的ant design vue有一些瑕疵,但不得不承认,能以一己之力撸完一个UI框架,是真的强,而他本人对于vue的理解也到很深的境界,于是我特做此视频笔记,较为零散,没什么章法,只是对于一些比重要的或者比较细节的地方做一下记录。

1,Props中的对象和数组类型必须从一个工厂函数获取,比如 List: { typs: Array, default: ()=>[], }

2,给组件动态传递属性时,属性值最好用破折号分开,如 <card :is-visible=“isCardVisible” />,但是在子组件的props中,可以用isVisible获取回来。因为在html中,大小驼峰语法(camelCase)等价于全小写的破折号语法(kebab);

3,原生属性如style,title,class如果传递给了子组件,会默认挂载到子组件的根元素上;

4,父组件向子组件注入方法,实则是注入了方法的指针,子组件在调用的时候还是调用到父组件里面;

5,this.$emit会返回当前组件的vue实例,也就是this指向的堆内存中地址;

6,建议组件以大写字母开头;

7,v-slot:name可以代替slot=“name”, v-slot:name=“(index, record)”可以代替slot=“name” 加上slot-scope=“index, record”;

8,为了减少复杂度,virtual dom的diff算法的基本概念就是”只做同层级节点比较”;

9,如果没有key值,diff算法在做同层级节点比较时,会严格按照时间顺序去对比,因为缺乏身份标识器key,导致甚至连顺序调换这种场景都无法识别,会直接销毁重建;所以它在同层级比较的时候并不知道下一级的关系会是怎样,它只关注当前层级的节点。这看起来是一个坏处,其实更是一个好处,只专注于当前层级的复杂度是最低的。 所以如果有key的话,在新的同层节点生成的时候,就会根据key值去找原同层节点组有没有完全相同,尽可能复用老节点。 所以key值的作用就是为了关闭严格顺序节点对比法则,尽可能复用相同节点,节省删除新建节点的开销。

10,组件的数据来源分为属性(通过props传进来的),以及状态(自身的data)。

11,只有被html用到的属性才会去做依赖收集,到时候才会去做更新通知。

12,如果需要对data的某个对象的某个属性值做监听,可以通过computed把这个属性值的层级提上来,然后在watch中监听computed里面的属性。

13,重置vue实例的data: Object.assign(this.$data, this.$options.data());

14,强制刷新template模板: this.$forceUpdate;

15,watch函数的参数依次为newVal, oldVal;

16,计算属性computed的优势就在于它可以监听多个数据依赖,当然用watch也可以,但是这样我们就要手动为每个数据依赖添加watch函数,显得十分冗余。

17,能用computed的地方就用computed。

18,provide提供响应式数据到子孙组件的最佳方式是直接把this指针赋给一个变量,然后传给子孙组件,子孙组件通过点运算符来取相应属性。

19,说明provide的查找类似于作用域链,从下往祖先组件找,一旦找到就停下了。

20,ref如果挂载到html元素上,会取到一个DOM节点;如果挂载到一个组件上,会取到这个组件的实例对象。

 

《Vue笔记01: 我与唐金州二三事》的更多相关文章

  1. 简单物联网:外网访问内网路由器下树莓派Flask服务器

    最近做一个小东西,大概过程就是想在教室,宿舍控制实验室的一些设备. 已经在树莓上搭了一个轻量的flask服务器,在实验室的路由器下,任何设备都是可以访问的:但是有一些限制条件,比如我想在宿舍控制我种花 ...

  2. 利用ssh反向代理以及autossh实现从外网连接内网服务器

    前言 最近遇到这样一个问题,我在实验室架设了一台服务器,给师弟或者小伙伴练习Linux用,然后平时在实验室这边直接连接是没有问题的,都是内网嘛.但是回到宿舍问题出来了,使用校园网的童鞋还是能连接上,使 ...

  3. 外网访问内网Docker容器

    外网访问内网Docker容器 本地安装了Docker容器,只能在局域网内访问,怎样从外网也能访问本地Docker容器? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Docker容器 ...

  4. 外网访问内网SpringBoot

    外网访问内网SpringBoot 本地安装了SpringBoot,只能在局域网内访问,怎样从外网也能访问本地SpringBoot? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装Java 1 ...

  5. 外网访问内网Elasticsearch WEB

    外网访问内网Elasticsearch WEB 本地安装了Elasticsearch,只能在局域网内访问其WEB,怎样从外网也能访问本地Elasticsearch? 本文将介绍具体的实现步骤. 1. ...

  6. 怎样从外网访问内网Rails

    外网访问内网Rails 本地安装了Rails,只能在局域网内访问,怎样从外网也能访问本地Rails? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Rails 默认安装的Rails端口 ...

  7. 怎样从外网访问内网Memcached数据库

    外网访问内网Memcached数据库 本地安装了Memcached数据库,只能在局域网内访问,怎样从外网也能访问本地Memcached数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装 ...

  8. 怎样从外网访问内网CouchDB数据库

    外网访问内网CouchDB数据库 本地安装了CouchDB数据库,只能在局域网内访问,怎样从外网也能访问本地CouchDB数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Cou ...

  9. 怎样从外网访问内网DB2数据库

    外网访问内网DB2数据库 本地安装了DB2数据库,只能在局域网内访问,怎样从外网也能访问本地DB2数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动DB2数据库 默认安装的DB2 ...

  10. 怎样从外网访问内网OpenLDAP数据库

    外网访问内网OpenLDAP数据库 本地安装了OpenLDAP数据库,只能在局域网内访问,怎样从外网也能访问本地OpenLDAP数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动 ...

随机推荐

  1. [TimLinux] docker CentOS7入门——服务(2)

    1. 服务含义 分布式应用中,应用的不同部分即称为“服务”,视频网站是一个分布式应用,包含有:数据的存储,视频的转码,前端展示等部分,对应的这些部分即称为相应的服务.docker平台中,定义.运行和扩 ...

  2. 模电&数电知识整理(不定期更新)

    模电总复习之爱课堂题目概念整理 Chapter 1 1) 设室温情况下某二极管的反偏电压绝对值为1V,则当其反偏电压值减少100mV时,反向电流的变化是基本不发生变化. 2) 二极管发生击穿后,在击穿 ...

  3. 《java面试十八式》--引子

    爪哇城中   “喂,你等等我啊”少女气喘吁吁的喊道   “大小姐,你可快点吧,报名马上就要结束了.”   这是爪哇城一年一度的大选比赛,被选上的人会留下来任职,享有名誉和金钱,所以大家都在积极准备. ...

  4. markdownPad在win10下渲染报错问题

    今天使用MarkdownPad 2,打开后发现预览效果出错了,本来以为自己下载了破解版的缘故导致软件不稳定,后来查找了网上,发现这是一个普遍的问题,根据软件的提示来到官方FAQ页面,找到解决方法. 实 ...

  5. debian官网qcow2镜像修改root账号密码,开启ssh等

    1.下载官网qcow2镜像文件 wget http://172.16.20.10/vmtemplate/KVM/wangrui/Debian/debian-10.2.0-openstack-amd64 ...

  6. ubuntu16.04没有办法使用CRT,或者SSH工具的解决办法

    首先要明确一点,ubuntu16.04是默认没有安装SSH工具的 情况1 首先需要切换到root模式,然后在进行安装 设置root密码 sudo passwd 然后  sudo apt-get ins ...

  7. Docker容器监控

    利用docker compose组合应用并利用scale可以快速对容器进行扩充,而docker compose启动的服务容器都在同一台宿主机上,对于一个宿主机上运行多个容器应用时,容器的运行情况,如: ...

  8. 【Java】在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序。请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数。

    题目描述: 在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序.请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整 ...

  9. MySQL的安装、启动和基础配置 —— windows版本

    下载 第一步:打开网址,https://www.mysql.com,点击downloads之后跳转到https://www.mysql.com/downloads 第二步 :跳转至网址https:// ...

  10. ssm整合——Spring配置(2)

    配置Spring 1. 环境准备 使用之前搭建Mabatis的环境 1.1 新建目录 新建spring的service业务逻辑包 在resources目录下新建spring的配置文件:applicat ...