![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 55
qq_40526866
这个作者很懒,什么都没留下…
展开
-
Vuex核心概念
Vuex几个核心概念StateGettersMutationsActionsModulesState(单一状态树)通过this.$store.commit()提交mutations里面的属性const store = new Vuex.Store({ state: { counter: 100 }, mutations: { increment(state) { state.counter++ }, decrement(state)原创 2021-02-18 14:09:50 · 80 阅读 · 0 评论 -
Vuex状态树
Vuex状态树管理图例Backend API是后端的意思从后端API接口拿到数据后就开始一一进行Actions是做异步操作的入伙使用Actions发送网络请求的话,当有异步操作时通过Actions操作就行,Actions做完之后在提交给Mutations就成同步操作了Mutations是做同步操作的通过Mutations修改State的话Devtools就能跟踪到了State是保存状态的如果直接通过store.state.count修改count的话,Devtools是跟踪不到的,必原创 2021-02-17 12:23:11 · 191 阅读 · 0 评论 -
使用Vuex
文章目录状态管理模式是什么呢安装Vuex创建一个store(仓库)文件夹配置Vuex在main.js中挂在它官方解释:Vuex是一个专门为Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension (opens new window),提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能状态管理模式是什么呢 其实可以把他原创 2021-02-17 11:46:04 · 130 阅读 · 1 评论 -
Vue中的query传参
query可以一次传入多个参数传递参数<template> <div id="app"> <router-link to="/home">首页</router-link> <router-link to="/about">关于</router-link> <router-link :to="'/user/'+userID">用户</router-link> <ro原创 2021-02-16 14:53:31 · 2510 阅读 · 0 评论 -
VueRouter动态获取路由
在某些情况下,一个页面的path路径可能不确定,如果我们要进入用户界面时,希望是:/user/zhangsan 或者 /user/lisi除了有前面的/user之外,后面还跟上了用户的ID这种path和Component的匹配关系,我们称之为动态路由(也是路由传递数据的一种方式){ path: '/user/:id', component: User}<div> <h2>{{ $route.params.id }}</h2></原创 2021-02-16 11:32:31 · 1741 阅读 · 0 评论 -
VueRouter的使用
第一步router文件夹里新建index.js// router文件夹里面的index.js// 1. 引入vue和vue-routerimport Vue from 'vue'import VueRouter from 'vue-router'// 引入需要的组件import Home from '../components/Home.vue'import About from '../components/About.vue'// 2. 在vue中使用路由Vue.use(VueR原创 2021-02-15 20:39:53 · 174 阅读 · 0 评论 -
Vue生命周期简易笔记
const app = new Vue({ el: '#app', data: { msg: 'aaaa', className: 'redBG' }, // 创建之前 // before:之前 // create:创建 beforeCreate() { //此时数据(data)和事件方法(methods)还为绑定到app对象上,可以在这里创建Ajax请求 console.log('我是创建之前的beforeCreate')原创 2020-09-27 10:58:13 · 60 阅读 · 0 评论 -
路由懒加载
当打包构建应用时,JavaScript 包会变得非常大,影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了。未使用路由懒加载之前import Vue from 'vue'import VueRouter from 'vue-router'import Home from '../components/Home.vue'import About from '../components/About.vue'import User原创 2021-02-16 12:01:02 · 43 阅读 · 0 评论