Vue初始

一、Vue的概述

Vue 发音类似 view

Vue 游雨溪 鱿鱼须 鱿鱼须不懂Vue

Vue历史

Angular React Vue

2013 Seed

2013 Seed命名为Vue

2014 Vue正式发布 0.8 - 0.10

2015 6.13 0.12

2015下半年 vue-cli vueRouter vueX 版本好1.0 vue正式跨入大众 渐进式框架(JQuery)

2016国庆 2.0.0 Vue正式成为三大主流框架 2版本 借鉴了 React diff算法 虚拟dom

2019 vue 2.6.0 为3版本打下基础

2020 3.0正式问世

现在 vue 2.7版本 是2版本的最高版本 (很多很多老项目用的还是vue2.0得有人维护)

vue 3.0是当前的正式版本

Vue2全家桶 =》 Vue VueRouter VueX axios

Vue的官网:Vue.js (vuejs.org)

库与框架

库 Library 是一些封装好的东西 一般来说功能局限 库完全由开发者控制 更便向于单一工具

框架 Framework 是一套完整的功能集合 帮助开发者解决问题的一整套方案 操作在框架

Jquery 封装了js的一些操作

Vue => html css js 路由 状态机

Vue使用

1. <!-- 从三方网站 引入网上的vue 需要网络 -->
2. <!-- <script src="/https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script> -->
3. <!-- 本地引入 -->
4. <script src="./js/vue.js"></script>

1. <div id="app">
2. { {title}}
3. </div>

1. let vm = new Vue({
2. el: '#app',
3. data: {
4. title : "蜗牛"
5. }
6. });

1. 推荐使用这种
2. let vm = new Vue({
3. data() {
4. return {
5. title: "蜗牛"
6. }
7. }
8. });
9. vm.$mount('#app');

1. // 取消Vue提示你正在使用开发模式的Vue
2. Vue.config.productionTip = false;

Vue devtools 点击扩展 获得扩展 搜索安装即可

但是这样开发效率不高 麻烦

我们一般采用