0基础学习vue2.x以3.x版本笔记day1

一、介绍：

        我们这先从vue2版本开始介绍，摘自vue2.x官网(介绍 — Vue.js)的一句话,Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。它是由尤雨溪 (Evan You)，前端框架Vue.js 作者，独立开源开发者。曾就职于 Google Creative Labs 和 Meteor Development Group。由于工作中大量接触开源的 Java 项目，最后自己也走上了开源之路，现在全职开发和维护 Vue.js。

二、起步

vue的版本：分为俩种一种是生产环境版本，一种是开发环境版本

区别：正如vue官网中提出的当我们安装的环境的版本是生产环境下的版本时他是自带提示报错功能的方便我们去调试代码。从而他的体积会变得跟大。反之，安装开发版本时他是没有这个提示功能的，他的体积更小。

vue的安装呢比较简单，通过查看官网呢提供了我们二种引入方式,但是呢，在安装引入依赖前vue官方建议你安装在使用 Vue 时，在你的浏览器上安装 Vue Devtools（GitHub - vuejs/devtools: ⚙️ Browser devtools extension for debugging Vue.js applications.）。它允许你在一个更友好的界面中审查和调试 Vue 应用。根据他提示的文档下载好后安装到谷歌浏览器上就是一下样子。

方式一：通过一下方式直接引入




方式二下载到本地然后在从本地进行引入，一般推荐第二种方式进行引入。
我这里下载的是开发版本方便代码调试。直接在https://v2.cn.vuejs.org/v2/guide/installation.html中单击开发版本进行下载就可以了，
他俩下载出来有个很大的区别：开发版本vue.js生产版本vue.min.js

一、使用插值语法编写第一个程序,hello world

    
    
 
    





    
{{vm.title}}，{{vm.name}}

二、vue中的模板语法：

    
    
    
    




    
插值语法
    
你好{{name}}
    

    
指令语法
     
    点我去看{{tenct.name}}1
     
    点我去看{{tenct.name}}2

三、vue中的数据绑定的方式

    
    
    



    
   数据单项绑定: 

    
   数据双向绑定: 

四、vue中的el作用域跟数据绑定的写法

    
    
    
    




    
{{name}}
    
{{name}}

    
函数式写法
    
{{name}}

五、Vue核心 MVVM模型 数据代理

 MVVM模型

1. M：模型model,说白了就是data中的数据
2. v:视图view,模板代码
3. vm:视图模型viewModel vue的实例化对象

    
    
    




    
{{student.title}}
    
{{student.addres}}

 待续...................................