Vue和ElementUI

Vue.js

网络通信：axios

页面跳转：vue-router

状态管理：vuex

Vue-UI：ElementUI,lessUI

引用地址：

https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js //完整版

https://cdn.bootcss.com/vue/2.5.16/vue.min.js //压缩版

https://unpkg.com/axios/dist/axios.min.js" //axios框架

基本语法

var vm = new Vue({

el:“#app”,

data:{

xxx : “xxx”

}

})

v-pre:vue不经过解析，直接将代码呈现

Vue七个常用属性

el:绑定的div id

data：数据

methods：方法

computed:就是将方法计算出的结果作为属性放入缓存中，以后调用直接从内存中取，调用get方法的两个时机：1、初次调用。2、依赖的数据发生变化时

data()方法，组件实例化的时候被调用

axios中的data()方法，用以数据交互

总结一下

基础语法

条件判断：if for

网络通信 axios

组件以及界面布局

next:

写一个单页面应用

常用语法:

• v-if
• v-else-if
• v-else
• v-for
• v-on 绑定事件，简写成@
• v-model 数据双向绑定
• v-bind 给组件绑定参数(props)，简写成:

组件化开发：

• 组合组件slot插槽
• 组件内部绑定事件用到的this.$emit(“事件名”,参数) //事件名是在组件中绑定的
• 计算属性computed，缓存计算数据

说明：

Vue的开发都是基于NodeJS，实际开发用vue-cli脚手架开发，vue-router路由，vuex做状态管理，UI我选择ElmentUI！

组件化定义

• 定义组件时不能写el，因为组件是砖，哪里需要哪里搬，应该由最终的vm对象决定组件应用的位置。
• 定义组件时，data要写成函数形式，因为组件在不同的位置不应该共享数据，以函数形式写每次调用时会初始化。

推荐的组件起名

1. 一个单词组成：首字母小写school、首字母大写School
2. 多个单词组成：单词之间加横杠my-school，每个单词字母大写MySchool（这种写法在搭建了脚手架之后才能用）

一个重要的内置关系

VueComponent.prototype.__proto__ = Vue.prototype

也就是说，Vue把VueComponent原型对象的隐式原型对象指向了Vue的原型对象，这样就让VueComponent可以使用Vue中的值。原本 VueComponent.prototype.__proto__指向的应该是Object

axios

四种请求：get，post，delete，put

ElementUI

validator写在data()里面，return上面