[笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 9-2

章节连结

前端框架御三家之一的 Vue,在 2020 年第四季迎来的第三代版本,代号为 One Piece。虽说已略为上手 2.0 版,决定借由 HiSKIO 2020 Vue3 专业职人 的课程,来加速自己的熟悉程度。这篇会笔记下 Vue 的关键核心 – Component 组件的使用。因为章节内容较多,所以拆成两部分来写。

vue.js logo vue


课程相关资讯

[连结]:https://hiskio.com/courses/286/lectures/22728

本篇范围:Chapter 7 ( Vue Component 组件 ) ,一共有 12 篇

请注意:本系列文章为个人对应课程的消化吸收后,所整理出来的内容。换言之,并不一定会包含全部的课程内容,也有可能会添加其他资源来说明。


笔记

1. setup() 里面默认有一个 context 参数,里面会有 emit 方法,可以将子层的东西传递到父层
2. 承上,你也可以使用解构的 { emit } ,直接取得 context 参数的 emit 方法来使用
3. 如同 props,也是可以执行型态和用函式验证,不过无法阻挡其传递,只是警告而已
4. Vue 有内建动画,必须搭配 v-if, v-show 作使用。可参考官方教学文件作使用。不过要注意,必须要自订好相关的 CSS
5. 内建动画有 6 个阶段,分别为 v-enter-from, v-enter-active, v-enter-to, v-leave-from, v-leave-active, v-leave-to
vue3 transition demo image


系列文章

  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 9
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 8
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 7
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 6
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 5
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 4
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 3
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 2
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 15
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 14
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 13
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 12
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 11
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 10
  • [笔记] HiSKIO 2020 Vue3 专业职人 进阶篇 – 1
  • [笔记] HiSKIO 2020 Vue3 专业职人 加值篇 – 5
  • [笔记] HiSKIO 2020 Vue3 专业职人 加值篇 – 4
  • [笔记] HiSKIO 2020 Vue3 专业职人 加值篇 – 3
  • [笔记] HiSKIO 2020 Vue3 专业职人 加值篇 – 2
  • [笔记] HiSKIO 2020 Vue3 专业职人 加值篇 – 1
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 9
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 8
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 7
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 6
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 5
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 4
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 3
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 2
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 16
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 14
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 13
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 12
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 11
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 10
  • [笔记] HiSKIO 2020 Vue3 专业职人 入门篇 – 1
  • 按赞加入粉丝团

    延伸阅读