vue MVVM的实现者，他的核心就是实现了DOM监听和数据绑定

  1. 引入Vue.js  
     <!--引入vue js 外部文件-->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
  2. 利用IDEA创建第一给Vue的程序
    复制代码
    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--view层 模板-->
<div id="app">
{{message}}
</div>

<!--引入vue.js 包-->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    var vm=new Vue({
        el:"#app",
　　    //model 层 ：数据
        data:{
            message:"hello,vue!"
        }
    });

</script>

</body>
</html>
    复制代码

     

  3. MVVM
    复制代码
    Model：模型层
View：视图层
ViewModel：连接视图和数据的中间件

为什么要使用MVVM
MVVM模式和MVC模式一样，主要目的是分离视图和模型，有几大好处
1.低耦合：视图可以独立于Model变化和修改，一共ViewModel可以绑定到不同的View上，当View变化的时候Model可以不变，当Model变化的时候View也可以不变。
2.可复用：你可以把一些视图逻辑放在一个ViewModel里面，让很多View重用这段视图逻辑。
3.独立开发：开发人员可以转载于业务逻辑和数据的开发，设计人员可以专注于页面设计。
4.可测试：界面素来是比较难于测试的，而现在测试可以针对ViewModel来写。
    复制代码

     

posted @   创客未来  阅读(151)  评论(0)  编辑  收藏  举报
编辑推荐：
· SQL Server 2025 AI相关能力初探
· Linux系列：如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列（二）：开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
阅读排行：
· 阿里最新开源QwQ-32B，效果媲美deepseek-r1满血版，部署成本又又又降低了！
· 单线程的Redis速度为什么快？
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决：字节Trae VS Cursor，谁才是开发者新宠？
· 展开说说关于C#中ORM框架的用法！
点击右上角即可分享
微信分享提示