vue学习大纲7:vuejs核心和vue.js的devtools

vuejs核心：

• 数据驱动
• 组件化

数据驱动

• DOM是数据的一种自然映射
  即：数据驱动dom变化，dom是数据的一种自然映射
• 他也会对操作做一些监听，当我们修改视图的时候，vuejs监听了这些变化，才会改变数据；
• 以上就形成了数据的双向绑定；

组件化

• 目的：扩展html元素，封装可重用的代码
• 组件设计原则：
  1、页面上每个独立的可视／可交互区域视为一个组件
  2、每个组件对应一个工程目录，组件所需的各种资源在这个目录下就近维护；
  3、 页面不过是组件的容器，组件可以嵌套自由组合形成完整的页面

vue.js的devtools安装

安装
1.github下载地址：https://github.com/vuejs/vue-devtools
2.下载好后进入vue-devtools-master工程 执行npm install ----->npm run build.
3.修改manifest.json 中的persistent为true

4.打开谷歌浏览器设置--->扩展程序--》勾选开发者模式---》添加工程中的shells-->chrome的内容或者直接拖动shells-->chrome，至此恭喜已经安装成功！！！

5.打开自己的vue项目中，如果是有vue-cli构建的项目，执行npm run dev,打开http://localhost:8080/ 服务器调试地址；至此完成devtools的安装；

• 使用:打开vue项目,在控制台选择vue：