vue.js简介、vue.js基础使用

vue.js简介

vue.js是什么

是一个构建用户界面的框架

是一个轻量级MVVM（Model-view-ViewModel）框架，和angular、react类似，其实就是所谓的数据双向绑定

数据驱动+组件化的前端开发（核心思想）

通过简单的api实现  响应式的数据绑定  和 组合的视图组件

更容易上手、小巧

版本：【vue 1.0】     【vue 2.0】

vue2.0 和 1.0 相比，最大的变化就是引入了virtual DOM（虚拟DOM），页面更新效率更高，速度更快

vue和angular的区别

vue.js使用

下载核心库vue.js

点击下载Vue.js

<script scr="http://vuejs.org/js/vue.min.js"></scripc>

使用，输出hello  Vue

HTML代码

<div id="app">{{message}}</div>

{{}}  两队大括号称之为模板，用来进行数据的拜个年定显示在页面中

JS代码

var app = new Vue({
    el: '#app',//指定要关联的选择器
    //存储数据
    data:{
      message: 'Hello Vue!'
    }
})

安装vue-devtools插件，便于在chrome中调试vue

配置是否允许vue-devtools检查代码，方便调试，上线后（生产环境）需要设置为false

Vue.config.devtools = ture;
Vue.config.productionTip = false;//阻止vue启动时，控制台生成生产消息

上一篇：canvas的基本操作

下一篇：Vue.js常用指令