jrg-project-5 icon indicating copy to clipboard operation
jrg-project-5 copied to clipboard

单向数据流

Open FrankFang opened this issue 8 years ago • 17 comments

简单来说,把一切双向绑定的语法都禁用,同时只在一个地方改动数据,那么留下来的就是单向数据流。

由于代码越来越琐碎,所以大家看 commit 要更加仔细了。

我会在 commit 下面的评论框 里写出主要思路。

  1. commit 使用 Vuex 思想重构
  2. commit 使所有字段都可以编辑
  3. commit 数据保存到 localStorage

至此,不管里怎么刷新页面,就跟刷新页面之前一样了。

接下来我们添加注册和登录。

commit 添加注册对话框

写完这一步,你要理解为什么点击「注册」按钮,就会弹出一个 Dialog,一定要看懂。

commit 使用 leancloud 注册

这是我们在 Todo List 里做过的事情,请看懂每一句话,我们的代码没有废话。

commit show errorMessage

一个真实的网页,应该对错误给出友好的提示!

commit 显示用户名和登出

commit 完成登出功能

commit 页面载入时获取已登录用户

commit 登录功能

commit 登录功能

commit 登录成功后关闭对话框、更新 store

commit show error message

致饥人谷学员

请看清楚每个 commit 里面代码的意思,你可以先抄,然后再改,但是你一定要思考每一句代码的意思,结合 Vuex 的文档,你都可以搞懂的。

完成上面代码,给出预览链接。

https://jirengu-inc.github.io/jrg-project-5/step-9-resumer/dist/#/

你们使用 LeanCloud 的 AV 对象时,可千万别用我的 app key 和 app id!

也就是不要抄我 commit 里面的 app key 和 app id ,请自己去 LeanCloud 申请应用!

疑问

如果有疑问,请在 QQ 群直接说。另外我计划周一和周三白天直播写这个应用的过程,有时间的可以来看~

重要 BUG

这个 BUG 每个使用 Vue 的人都会遇到,但他可能由于不理解 Object.defineProperty 的用法,无法「独立解决」这个 BUG。

BUG 的解决见

commit: 修复一个 BUG

绝对绝对绝对不能让 data 中的对象的任何一个属性值变为 undefined 或者 null, 原因见 https://cn.vuejs.org/v2/guide/reactivity.html

FrankFang avatar Mar 02 '17 08:03 FrankFang

page code

hungryYang avatar Mar 03 '17 02:03 hungryYang

预览 源码

raszxcv avatar Mar 04 '17 15:03 raszxcv

预览 代码

code-zhangrui avatar Mar 06 '17 11:03 code-zhangrui

@code-zhangrui 我点你的预览,怎么连注册按钮都看不见~

FrankFang avatar Mar 06 '17 13:03 FrankFang

预览 代码

zhangjiuyi avatar Mar 07 '17 15:03 zhangjiuyi

老师,我用chrome和火狐都能打开

​ 但是IE11和Safari都看不到

2017-03-07 23:31 GMT+08:00 张久屹 [email protected]:

预览 https://zhangjiuyi.github.io/Project5/vue-resume/dist/#/ 代码 https://github.com/zhangjiuyi/Project5/tree/master/vue-resume

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jirengu-inc/jrg-project-5/issues/10#issuecomment-284755006, or mute the thread https://github.com/notifications/unsubscribe-auth/AWbkeBJuYbYzpuVsnm5-O8_VzLyZxIFmks5rjXg4gaJpZM4MQqvT .

code-zhangrui avatar Mar 08 '17 02:03 code-zhangrui

doge~

Source code Preview

谢谢方方 ,记住data不能以任何形式消失的原则了 . object.defineproperty的特性

starlikerain avatar Mar 08 '17 07:03 starlikerain

@starlikerain 你的 user 变量被消除了 id 和 username 属性,导致 Vue.js 无法监听 user 的变化。 这个 bug 的解决见 https://github.com/jirengu-inc/jrg-project-5/commit/f4d536a67ae468e1411d054db48bfea65330d596

FrankFang avatar Mar 08 '17 15:03 FrankFang

预览

代码

ZW

muxi7 avatar Mar 11 '17 10:03 muxi7

预览 代码


还是需要看几遍文档,做的时间隔久了就容易忘掉之前看的文档内容

baixiaoji avatar Mar 19 '17 06:03 baixiaoji

代码 预览

LisaLi85 avatar Mar 21 '17 03:03 LisaLi85

代码 预览 有个小bug,登录、注册、登出后,topbar不会自动更新 "你好{{username}}",除非刷新页面,学到后面希望自己可以解决..

Honohonoho avatar Jun 16 '17 13:06 Honohonoho

源码 预览

boloog avatar Jun 18 '17 15:06 boloog

预览demo

andreaxiang avatar Aug 04 '17 16:08 andreaxiang

预览

1-WEEK avatar Sep 17 '17 10:09 1-WEEK

预览 https://clementlxd.github.io/resume-task8/dist/index.html#/ 代码 https://github.com/clementlxd/resume-task8

clementlxd avatar Sep 20 '17 13:09 clementlxd