2019-06-30

路由基础

</router -link>:用来生成路由器连接
< router-link to ="/xxx"> GO to xxx</router -link>
<router-view>: 用来显示当前路由组件界面
<router-view></router-view>
.总结: 编写使用路由的 3 步
1）定义路由组件
2）注册路由
3）使用路由

axios

通用的 ajax 请求库, 官方推荐, vue2.x 使用广泛

// 引入模块
import axios from 'axios'
// 发送 ajax 请求
axios.get(url)
.then(response => {
console.log(response.data)
// 得到返回结果数据 })
.catch(error => {
console.log(error.message)
})
vuex 是什么简单来说: 对 vue 应用中多个组件的共享状态进行集中式的管理(读/写)

vuex 核心概念和 API

state

1）vuex 管理的状态对象

2）它应该是唯一的

const state = {

xxx: initValue

}

状态自管理应用

1）state: 驱动应用的数据源

2）view: 以声明方式将 state 映射到视图

3）actions: 响应在 view 上的用户输入导致的状态变化(包含 n 个更新状态的方法)

modules

1）包含多个 module
2）一个 module 是一个 store 的配置对象
3）与一个组件(包含有共享数据)对应 向外暴露 store 对象

export default new Vuex.Store({ state,  mutations,  actions,    getters}) 
#组件中
import {mapState, mapGetters, mapActions} from 'vuex'export default {   computed: {     ...mapState(['xxx']),       ...mapGetters(['mmm']), }   methods: mapActions(['zzz'])}{{xxx}} {{mmm}} @click="zzz(data)" 
#映射
c storeimport store from './store'new Vue({ store})