路由基础
</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})