这篇文章的知识点是父子组件通讯，如果你了解 props, 但是还没了解过 $attrs，那么建议你花1分钟时间阅读，了解它的优点，并学会在项目中使用。 包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style 除外)。当一个组件没有声明任何…

本篇将探讨关于Vue中父子组件的生命周期顺序。 父组件的mounted是在最后执行的。 因此在子组件的mounted中渲染父组件在mounted阶段请求的数据，是会无反应的。因为子组件mounted渲染数据会发生在父组件mounted请求数据之前。 See the Pen Vu…

使用props，父组件可以使用props向子组件传递数据。 父组件向子组件传递事件方法，子组件通过$emit触发事件，回调给父组件。 inheritAttrs：默认值为true，设置为false时，没有被子组件继承的父组件属性（子组件的属性定义在组件的props中），不会当做特…

其实Vue官方从2.6.X版本开始就部分使用Ts重写了。 我个人对更严格类型限制没有积极的看法，毕竟各类转类型的骚写法写习惯了。 1. 使用官方脚手架构建 新的Vue CLI工具允许开发者 使用 TypeScript 集成环境 创建新项目。 只需运行vue create my-…

Vue 代码中的 slot 是什么，简单来说就是插槽。 <slot> 元素作为组件模板之中的内容分发插槽，传入内容后 <slot> 元素自身将被替换。 看了上面这句官方解释，可能一样不知道 slot 指的是什么，那么就来看看在 Vue 中，什么时候你需要用到 slot 。 举例…

本项目已经为你生成了一个完整的开发框架，下面是整个项目的目录结构。 启动完成后会自动打开浏览器访问 [http://localhost:9000， 你看到下面的页面就代表操作成功了。 目前前端的一个开发趋势是以搭建单页应用 (SPA) 为主的。当应用体系比较大，或者你的应用业务…

在日常的业务的处理中，尤其是数组的for循环渲染，当你使用完v-for之后，动态的通过操作index指定数组的值，不是响应的。 这就很有意思了，我们可以看到这个过程中，执行changeList()方法，页面上的11并没有变成16且数组也没有变为空数组，但是执行第二个方法时，th…

See the Pen vue生命周期详解 by madman0621 (@madman0621) on CodePen. 在实例初始化之后，数据观测(data observer) 和 event/watcher 事件配置之前被调用。 在进行初始化事件、数据观测之后调用crea…

本文最核心的一点就是：HTML 是大小写不敏感的，在 DOM 模板中必须使用 kebab-case（myDiv与mydiv在DOM模版中是等同的）。以下的内容所提及的注意事项都是基于这条核心的。 组件名应该始终是多个单词的，根组件 App 除外。 这样做可以避免跟现有的以及未来…