【2.0】Vue之引入
【一】Vue介绍
-
Vue (读音 /vjuː/,类似于 view) 是一个渐进式JavaScript框架,用于构建用户界面。
-
它与其他大型框架的不同之处在于,Vue的设计理念是可以逐层应用的。
-
Vue的核心库只关注视图层,这使得它不仅易于上手,还方便与第三方库或已有项目进行整合。
-
Vue采用了M-V-VM(Model-View-ViewModel)的思想
- 它是一种基于前端开发的架构模式,也是一种事件驱动的编程方式。
- 在M-V-VM中
- Model代表前端的数据,可以简单理解为JavaScript的变量;
- View代表我们看到的界面,包括CSS和HTML;
- ViewModel负责连接 Model和View
- 当Model发生变化时,View页面就会相应地发生变化;
- 同样地,当View页面发生变化时,ViewModel中的变量也会相应地改变。
-
除了M-V-VM,还有其他一些常见的架构模式
- 例如
- MTV(Model-Template-View)
- MVC(Model-View-Controller)
- MVP(Model-View-Presenter)。
- 然而
- 在前端开发中,MVVM和组件化开发、单页面开发(SPA)结合使用的情况比较普遍。
- 例如
-
目前,Vue的最新版本是Vue4,但并没有公司在使用
- 主流的公司项目基本上会采用Vue3
- 而老项目仍然继续使用Vue2。
【二】编辑器的选择
- python---》Pycharm
- 前端
- webstorm:(jetbrains公司的,使用习惯跟Pycharm)
- vscode:免费
- Sublime Text
- vim
【三】Vue下载
-
下载
https://cdn.jsdelivr.net/npm/vue/dist/vue.js
【四】使用
<body>
<div id="app">
<!-- 插值语法 -->
{{s}}
<h1>{{name}}</h1>
</div>
</body>
<script>
var vm = new Vue({
el: "#app",
data: {
s: "hello world",
name:"dream"
}
})
</script>
本文来自博客园,作者:Chimengmeng,转载请注明原文链接:https://www.cnblogs.com/dream-ze/p/17610233.html