Vue入门 - 事件 - 生命周期图

最新推荐文章于 2024-04-06 09:45:06 发布

_Leaf1217

最新推荐文章于 2024-04-06 09:45:06 发布

阅读量208

点赞数

分类专栏： Vue 文章标签：前端 javascript vue

本文链接：https://blog.csdn.net/qq_63492318/article/details/126652170

版权

本文是Vue.js的入门指南，涵盖了Vue的基本概念，如它是一个渐进式JavaScript框架，与库的区别，以及MVVM模式。详细讲解了数据双向绑定的实现步骤，并探讨了Vue的事件处理，强调了不再需要直接操作DOM。此外，文章深入讨论了Vue的生命周期，列举了所有钩子函数，并指出了初始化时默认触发的钩子。

摘要由CSDN通过智能技术生成

4.2 vue初始化默认会触发的钩子函数有哪些？

一、Vue的简介

1.1 Vue.js 是什么

Vue是一个构建用户界面(UI)的[渐进式]JavaScript框架

官网：Vue.js - 渐进式 JavaScript 框架 | Vue.js

1.2 库和框架的区别

1.2.1 库(Library)，本质上是一些函数的集合。每次调用函数，实现一个特定的功能，接着把控制权交给使用者

      代表：jQuery

      jQuery这个库的核心：DOM操作，即：封装DOM操作，简化DOM操作

1.2.2 框架(Framework)，是一套完整的解决方案，使用框架的时候，需要把你的代码放到框架合适的地方，框架会在合适的时机调用你的代码

      代表：vue

      框架规定了自己的编程方式，是一套完整的解决方案

      使用框架的时候，由框架控制一切，我们只需要按照规则写代码

      框架的侵入性很高(从头到尾)

1.3 MVVM的介绍

MVVM，一种更好的UI模式解决方案，MVVM通过数据双向绑定让数据自动地双向同步，相比较于mvc更加便捷；

MVVM ===> M / V / VM

M：model数据模型

V：view视图

VM：ViewModel 视图模型虚拟dom

二、Vue入门-数据双向绑定

2.1 实现步骤

① 导入js依赖 2.6.10（cdnjs.com、bootcdn.net）

② 定义vue所管理边界

③ 创建vue实例

④ 挂载便捷

实现Hello vue!!!的页面：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.10/vue.js">&

最低0.47元/天解锁文章

_Leaf1217

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
Vue入门 - 事件 - 生命周期图

Vue是一个构建用户界面(UI)的[渐进式]JavaScript框架。
复制链接

扫一扫

专栏目录