Vue 开发实战
唐金州
一点资讯前端技术专家,Ant Design Vue 作者
60939 人已学习
新⼈⾸单¥59
课程目录
已完结/共 53 讲
Vue 开发实战
登录|注册
留言
27
收藏
沉浸
阅读
分享
手机端
回顶部
当前播放: 21 | Vuex最佳实践
00:00 / 00:00
高清
  • 高清
1.0x
  • 2.0x
  • 1.5x
  • 1.25x
  • 1.0x
  • 0.75x
  • 0.5x
网页全屏
全屏
00:00
付费课程,可试看
01 | 课程介绍
02 | Vue简介
03 | 内容综述
05 | 组件基础及组件注册
04 | 第一个Vue程序
06 | Vue组件的核心概念:事件
07 | Vue组件的核心概:插槽
08 | 理解单文件组件
09 | 双向绑定和单向数据流不冲突
10 | 理解虚拟DOM及key属性的作用
11 | 如何触发组件的更新
12 | 合理应用计算属性和侦听器
13 | 生命周期的应用场景和函数式组件
14 | 指令的本质是什么
15 | 常用高级特性provide/inject
16 | 如何优雅地获取跨层级组件实例(拒绝递归)
17 | template和JSX的对比以及它们的本质
18 | 为什么需要Vuex
19 | 如何在Vue中使用Vuex
20 | Vuex核心概念及底层原理
21 | Vuex最佳实践
22 | Vue Router的使用场景
23 | 选择何种模式的路由及底层原理
24 | Nuxt解决了哪些问题?
25 | Nuxt核心原理是什么?
26 | UI组件库对比:Element UI、Ant Design Vue、iView
27 | 提升开发效率和体验的常用工具:ESLint、Prettier、vue-devtools
28 | 单元测试的重要性及其使用
29 | 生态篇习题解答(上)
30 | 生态篇习题解答(下)
31 | Ant Design Pro介绍
32 | 使用Vue CLI 3快速创建项目
33 | 如何自定义Webpack和Babel配置
34 | 如何设计一个高扩展性的路由
35 | 实现一个可动态改变的页面布局
36 | 如何将菜单和路由结合
37 | 如何使用路由管理用户权限
38 | 更加精细化的权限设计(权限组件、权限指令)
39 | 如何在组件中使用ECharts、Antv等其他第三方库
40 | 如何高效地使用Mock数据进行开发
41 | 如何与服务端进行交互(Axios)
42 | 创建一个普通表单
43 | 初始数据、自动校验、动态赋值
44 | 创建一个分步表单
45 | 自己封装一个支持自动校验的表单项
46 | 如何管理系统中使用的图标
47 | 如何定制主题及动态切换主题
48 | 如何做好国际化
49 | 如何高效地构建打包发布
50 | 如何构建可交互的组件文档
51 | 如何做好组件的单元测试
52 | 如何发布组件到npm
53 | 结课测试&GitHub相关生态应用(持续集成、单测覆盖率、文档发布、issue管理)
本节摘要
登录 后留言

全部留言(27)

  • 最新
  • 精选
Kian
这个地方还是需要好好研究一下的,vuex的最佳实践方案。以及命名空间的使用,不过像vuex的一些api 比如mapMatations 这种老师没有讲过的还是需要自己去查一下如果使用。 老师的教案没有详细的备注,所以有些地方可能比较难懂。https://github.com/Ccheng2729111/vuex-demo 我这边上传了一份有详细备注的项目,并且加上了老师留下的课后习题。希望可以帮到有疑惑的同学。

作者回复: 👍🏻

2019-11-04
3
22
冬天的雪好暖
老师您好,我想问问用了vuex,router以后还需要用前面父子组件之间的传值(例如props)吗?而且组件的引用都在router里面,插槽还能用吗?

作者回复: 都用vuex ? 不建议这么做,有句话是这么说的: 如果你不知道要不要用vuex ,那你大概率是不需要vuex的 组件的引用都在router? 你这个要吗是项目简单,要吗是你的路由非常庞大!

2019-04-11
1
tuyu
作者你好, 那个 ...mapState({}) 中...是啥意思

作者回复: Es6的扩展运算符 mapstate返回的是对象 可以任何搜索引擎搜索 es6扩展运算符 查看更多资料

2019-07-07
Geek_redrain
额,上了vuex的官方文档看了下,原来action函数接受一个与 store 实例具有相同方法和属性的 context 对象,我明白了。

作者回复: 👍

2019-05-31
Lily
[CART.SET_CART_ITEMS] (state, { items }) { state.items = items }, [CART.SET_CHECKOUT_STATUS] (state, status) { state.checkoutStatus = status } } commit(CART.SET_CHECKOUT_STATUS, null) // empty cart commit(CART.SET_CART_ITEMS, { items: [] }) shop.buyProducts( products, () => commit(CART.SET_CHECKOUT_STATUS, 'successful'), () => { commit(CART.SET_CHECKOUT_STATUS, 'failed') // rollback to the cart saved before sending the request commit(CART.SET_CART_ITEMS, { items: savedCartItems }) } ) 老师您好,我想问下 [CART.SET_CHECKOUT_STATUS] 这样写是什么操作呢? commit(CART.SET_CHECKOUT_STATUS, null)还有就是这样写?看不太懂

作者回复: 属性名表达式,这里有详解 http://es6.ruanyifeng.com/?search=%E8%A1%A8%E8%BE%BE%E5%BC%8F&x=0&y=0#docs/object#%E5%B1%9E%E6%80%A7%E5%90%8D%E8%A1%A8%E8%BE%BE%E5%BC%8F

2019-05-17
文哲
老师vuex-orm这个我觉得应该可以的呀

作者回复: 可以用 不过目前我还是喜欢原装的

2019-05-09
young
老师,import { xxx } from "vuex" 为什么要用{}括号啊?前面的课程没有这样的语法

作者回复: 可以补一下 es6的知识, import {xxx} 是es6 模块化的知识, http://es6.ruanyifeng.com/#docs/module

2019-04-14
Ronnie
created () { this.$store.dispatch('products/getAllProducts') },老师,这里其实就是在模拟了异步去取数据,那不是应该在mounted生命周期么?为什么这里在created里获取?

作者回复: 对的,这两个周期实际上都可以,如果你看官方的异步demo,基本也都在created中去做,只是如果需要SSR,created会在服务端也执行,就需要放在mounted中,如果你不考虑ssr,这两个还是很随意的

2019-04-09
Mayao
请问下 什么场景用 mapState 取值 , 什么时候用 mapGetters 取值, 分不清这两者取回来的值有什么区别. 不都是拿到state里的数据吗

作者回复: 都能满足需求,mapGetters就像计算属性一样,涉及到多个state合并或计算时,可以使用,起到缓存的效果

2019-04-09
AMGMH
辅助函数mapState和mapGetters有哪些区别?是否可以将ProductList.vue文件中 computed: mapState({ products: state => state.products.all, }) 的写法改为在 product.js 文件更改getters如: const getters = { products: state => state.all } 从而在ProductList.vue中使用 computed: mapGetters('products', ['products'])

作者回复: 可以看 Mayao的问题回复

2019-04-08
收起评论