vue学习笔记——mvvm原理及第一个vue程序

ChienAAAy

于 2020-08-02 11:39:33 发布

阅读量211

点赞数

文章标签： vue java

本文链接：https://blog.csdn.net/qq_29384339/article/details/107742469

版权

MVVM是什么？

响应式，双向数据绑定，即MVVM。是指数据层（Model）-视图层（View）-数据视图（ViewModel）的响应式框架。
它包括：

将数据双向绑定（data-binding）作为核心思想，View 和 Model 之间没有联系，它们通过 ViewModel 这个桥梁进行交互。
Model 和 ViewModel 之间的交互是双向的，因此 View 的变化会自动同步到 Model，而 Model 的变化也会立即反映到 View 上显示。
当用户操作 View，ViewModel 感知到变化，然后通知 Model 发生相应改变；反之当 Model 发生改变，ViewModel 也能感知到变化，使 View 作出相应更新。

在这里插入图片描述

第一个vue程序

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>
<!--view层 模板-->
<div id="app">
    <h2>{{message}}</h2>
</div>
</body>
<!--导入vue.js-->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<script>
    var vm = new Vue({
        el:"#app",
        /*model 数据*/
        data:{
            message:"hello,vue"
        }
    })
</script>
</html>

可以通过浏览器控制台实时更新view中的内容
在这里插入图片描述

ChienAAAy

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vue学习笔记——mvvm原理及第一个vue程序

MVVM是什么？响应式，双向数据绑定，即MVVM。是指数据层（Model）-视图层（View）-数据视图（ViewModel）的响应式框架。它包括：将数据双向绑定（data-binding）作为核心思想，View 和 Model 之间没有联系，它们通过 ViewModel 这个桥梁进行交互。Model 和 ViewModel 之间的交互是双向的，因此 View 的变化会自动同步到 Model，而 Model 的变化也会立即反映到 View 上显示。当用户操作 View，ViewMode
复制链接

扫一扫