Vue基础之初识Vue

2024年4月26日 88次阅读 来源: 一枚蛋Oops

Vue特点及优点

  • 小巧，压缩后体积17KB；
  • 渐进式，不需要一口吃成大胖子，一上来就用所有的东西，可以一步一步、有阶段的先吃成小胖子；
  • 数据驱动，双向数据绑定，MVVM模式，详见下一段
  • 指令，例如v-if/v-show等
  • 插件，如果你听过鼎鼎有名的饿了么UI你就更能体会其中精妙之处，不过不要着急

MVVM模式（面试考点）

和知名前端框架Angular一样，Vue.js设计上也使用MVVM模式
MVVM模式（Model-View-ViewModel）由MVC模式衍生而来。当View（视图层）发生变化时，会自动更新到ViewModel（视图模型），逆推也成立。所以这两者（View-ViewModel）的关系就是所谓的数据双向绑定。

下载安装

  1. 通过script加载CDN文件
<!-- 指定某个具体版本的Vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.js"></script>
<!-- 自动识别最新版本的Vue.js -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

两个版本都可以，如果不太了解各个版本的区别，建议直接使用最新的稳定版本（如果辗转反侧非想了解其中的差别可以前往vue官方文档的安装章节的“对不同构建版本的解释”）。注意：在你发布的站点中使用生产环境版本，把 vue.js 换成 vue.min.js。这是一个更小的构建，可以带来比开发环境下更快的速度体验。

  1. 将代码下载下来，通过自己的相对路径引用

  2. npm下载
    只需要会npm的使用和项目初始化就可以了

    NPM是随同NodeJS一起安装的包管理工具，由于新版的nodejs已经集成了npm，所以之前npm也一并安装好了。NPM允许用户从NPM服务器下载别人编写的第三方包到本地使用

    使用 npm 命令安装模块

    npm install 模块名

    npm install vue

以上是本期全部内容，欲知后事如何，请听下回分解<(￣︶￣)↗[GO!]

    原文作者：一枚蛋Oops
    原文地址: https://segmentfault.com/a/1190000017856876
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞