初学Vue+Vue.js环境搭建+vue的MVVM架构+Vue.js指令

初学Vue+Vue.js环境搭建+vue的MVVM架构+Vue.js指令

前端必学

vue.js,argular.js,react.js

项目前端_Vue.js环境搭建

1.通过CDN加速的方式可以引入vue(需要联网)
进入BootCDN官网：https://www.bootcdn.cn/。

进入vue界面引入vue.js

引入vue.js

2.通过下载本地vue.js的方式(单页应用)

将js文件中的vue.js引入到html页面

3.vue-cli脚手架的方式(大型项目)
可去往该博客查看 https://segmentfault.com/a/1190000013950461

基于vue实现简单的MVVM架构

数据---model---viewModel---view

MVVM作为数据绑定的入口，整合Observer、Compile和Watcher三者，
通过Observer来监听自己的model数据变化，通过Compile来解析编译模板指令，
最终利用Watcher搭起Observer和Compile之间的通信桥梁，达到数据变化
->视图更新；视图交互变化(input) -> 数据model变更的双向绑定效果。

学习顺序（推荐）:
实现VMVM、数据代理、实现Observe、实现Complie、实现Watcher。

指令:

指令比{{}}有更高的优先级

如下是一些基本的vue.js指令:
v-text:绑定标签的文本
v-html:绑定标签的文本,但是会解析html代码
v-for:循环元素
v-if
v-model  文本框...
v-show
v-on:绑定事件
v-bind:可以绑定任何属性
v-focus:自定义指令
computed:计算属性