2018 我所了解的 Vue 知识大全（一）

2024-06-13 03:14:37

年初第一个 flag 就是掌握 vue ，哈哈

Vue ，React ，Angular 三大主流框架，最后我选择学习 Vue ，接触过 React ，自己感觉学习曲线有些陡峭，进而我选择了学习 Vue ，他的学习曲线平稳很多；不管选择什么框架，除了对基础的知识有一定的了解掌握，还应该对 ES6 有一定的了解；

这就是我脑海中的 Vue 知识体系；

一句话概况了 Vue 通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件;

Vue 的创建

一个简单的 Vue 实例只需要四步即可

我们的学习目的肯定不止于创建简单的 Vue 实例；而是用它去实现更加多变的功能需求；那我们需要进一步去学习 Vue-router 和 Vuex 以及 Vue-cli；

先说说基础的 Vue 吧，在创建了一个简单 Vue 实例之后，我们是否还能在实例中添加更加完善的数据选项，去完成我们多变的功能需求；答案是肯定能的；

指令

下面是我用上述指令写的一个小案例，刚好所有的指令都上了用场

详细请看 demo 源码

自定义指令

在代码的实例中

查看代码源

Vue API

Vue 常用选项

这就是我在学习 Vue 的时候，在 Vue 实例中添加的比较多的； directives 和 components 在 Vue 实例中为创建的局部自定义指令和注册组件，Vue.directive() 和 Vue.component() 则是注册全局

Vue 组件

生命周期钩子

每个 Vue 实例在被创建之前都要经过一系列的初始化过程。例如需要设置数据监听、编译模板、挂载实例到 DOM、在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，给予用户机会在一些特定的场景下添加他们自己的代码。

在 QQ 群里看到一张生命周期图，我觉得写的特别好,感谢总结这张图的朋友

配合着实例代码效果更佳查看代码源生命周期钩子的函数简单说就是八个函数

如何让 Vue 书写更佳优美？

详细 style-guide 请参看官网进一步学习请参考官方文档

部分资源来自网络；

欢迎继续关注，后续持续更新补全

2018 我所了解的 Vue 知识大全（一）相关推荐

vue开发看这篇文章就够了 vue知识大全
Vue -渐进式JavaScript框架介绍 vue 中文网 vue github Vue.js 是一套构建用户界面(UI)的渐进式JavaScript框架库和框架的区别我们所说的前端框架与库的 ...
2018年英语计算机职称考试,2018年职称计算机考试报考指南大全
[摘要]环球网校分享的2018年职称计算机考试报考指南大全以下介绍了职称计算机考试简介.考试时间.报名时间等考试安排希望对大家有帮助,更多资料敬请关注环球职称计算机考试频道,网校会及时更新考试资讯 [ ...
计算机基础知识整理大全_【干货整理】高中文言文基础知识大全，速度收藏！...
今天和大家分享的是高中文言文基础知识大全高中文言文基础知识大全文言文是以古汉语文雅的口语为基础的书面形式,在远古时代文言文与平常的口语的差异微乎其微.现今文言文是中国古代的一种书面语言组成的文章 ...
磁盘加密软件TrueCrypt知识大全（二）之创建文件型加密卷
磁盘加密软件TrueCrypt知识大全(二)之创建文件型加密卷 1.在"TrueCrypt"窗口中选择"创建加密卷(C)"按钮,在向导中选择"创建文件 ...
磁盘加密软件TrueCrypt知识大全（三）之加密非系统分区/设备
磁盘加密软件TrueCrypt知识大全(三)之加密非系统分区/设备 1.点击创建加密卷. 2.↑选择第2个,加密非系统分区/设备.第一个是通过创建文件的方式创建加密卷,由于文件容易误删除.丢失.破坏. ...
Python学习--最完整的基础知识大全
##Python学习–最完整的基础知识大全关于python的基础知识学习,网上有很多资料,今天我就把我收藏的整理一下分享给大家! #####菜鸟教程python2 #####菜鸟教程python3 ...
计算机基础知识整理大全_知识大全 | 物理选修35quot;波粒二象性quot;
图图说: 作为高中课程学习的常备工具书,本丛书以新考试大纲和课程标准为依据,参照新课标各版本教材编写而成,包括新课标各版本教材必修和选修的知识点,并对知识点进行了详细讲解与说明,同时以高考真题诠释对知 ...
java（5）---Java基础知识大全
Java基础知识大全一.基础知识: 1.JVM.JRE和JDK的区别: JVM(Java Virtual Machine):java虚拟机,用于保证java的跨平台的特性. java语言是跨平 ...
MTK 驱动（4）---MTK Android Driver知识大全
MTK Android Driver知识大全一.Display 1.lcm 相关概念 1.1) MIPI接口:一共有三种接口:DBI(也做CPU或MCU接口).DPI(也叫RGB接口).DSI. 在 ...

最新文章

热门文章