vue.js学习总结

下面使用的命令工具为git bash

第一步：使用命令行工具搭建vue.js项目

vue.js官网命令行工具安装

为了提升安装速度，建议将 npm 的注册表源设置为国内的镜像

1.输入命令：npm install -g cnpm --registry=https://registry.npm.taobao.org，后续将使用cnpm代替npm进行安装

2.输入命令：cnpm -v，查看当前cnpm的版本号

3.输入命令：cnpm install -g vue-cli，给全局安装vue-cli，这样才能使用vue这个命令

4.输入命令：vue init webpack my-first-vue-project，创建一个基于webpack模板的项目,项目名为my-first-vue-project

5.输入命令：cnpm install，下载依赖，文件夹目录中多了一个node_modules

6.输入命令：cnpm run dev，将项目运行起来，服务启动起来，端口为8080http://localhost:8080

sublime可以下载vue syntax highlight插件来语法高亮.vue

vue.js实例中的重要选项

data：存储数据

methods：方法，内部可以使用this.属性名取data里面定义的数据

watch：监听数据的变化，与data中的数据对应

vue对象通过html指令将view层与model进行关联

重要的指令有：

v-text：渲染数据

v-if：控制显示

v-on：绑定事件

v-for：循环渲染

当页面每次编辑完保存时，vue的脚手架工具会自动将.vue的文件转换成浏览器能够识别的代码，并且实现热更新，不用刷新即可在页面上看到我们编辑完后的展示。

vue.js的watch监听：

举例：var obj = {a: ‘1‘,b: ‘2‘};

　　　修改b的值：obj.b = ‘3‘;

　　　当watch的deep为true，则会触发监听的回调函数；但为普通监听的时候，则不会触发监听的回调函数