Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

如何优雅实现多页/跨页面状态管理? #87

Closed
xmsz opened this issue Feb 25, 2020 · 7 comments
Closed

如何优雅实现多页/跨页面状态管理? #87

xmsz opened this issue Feb 25, 2020 · 7 comments

Comments

@xmsz
Copy link

xmsz commented Feb 25, 2020

由于遵循 web 端多页机制,以往的的全局状态管理方法都不太合适

所以,有什么优雅的办法来解决多页/跨页面的状态管理?

现在

  1. Web 上的各种页面通信用不了
  2. 最基础的window.addEventListener('storage',()=>{})的也用不行
  3. 各种以往挂载到 app 的方法不符合规范
  4. 使用 js 文件单例机制也不符合规范
@xxxBW
Copy link

xxxBW commented Mar 5, 2020

多页在web上通信可以用cookie之类的来存储

@xmsz
Copy link
Author

xmsz commented Mar 6, 2020

多页在web上通信可以用cookie之类的来存储

不是本地储存是通信。。。 cookie 怎么通信?通信指的是

  1. 状态变化广播

全局状态管理还包括

  1. 状态变化同步

在单页里,实现状态同步很简单。kbone 单个页面也没问题。但现在多个页面没办法实例都不是一个
然后只能选择通信方案,但是以往我们通信有浏览器提供的 api。或者最粗暴就是监听本地储存变化。现在也不行

@TomVista
Copy link

小程序页面生命周期事件,打开页面 返回页面后,更新页面数据,缺点是,不实时

@xmsz
Copy link
Author

xmsz commented Mar 30, 2020

小程序页面生命周期事件,打开页面 返回页面后,更新页面数据,缺点是,不实时

这个方案之一,不过不推荐,因为小程序的生命周期web没有。

而两者都有的是对storage(kbone自己封装了所以支持)的监听,所以推荐使用这个方案。

@JuneAndGreen
Copy link
Collaborator

已提供跨页面的通信和数据存储方法,文档:https://wechat-miniprogram.github.io/kbone/docs/guide/advanced.html#%E8%B7%A8%E9%A1%B5%E9%9D%A2%E9%80%9A%E4%BF%A1%E5%92%8C%E8%B7%A8%E9%A1%B5%E9%9D%A2%E6%95%B0%E6%8D%AE%E5%85%B1%E4%BA%AB

参考例子(此例子中所有页面共享一个 vuex 的 state):https://github.com/Tencent/kbone/tree/develop/examples/demo22

@xmsz
Copy link
Author

xmsz commented Apr 5, 2020

@JuneAndGreen
Copy link
Collaborator

JuneAndGreen commented May 2, 2020

备注:在原先的 demo22 里全局使用 vuex 的例子中,存在某些缺陷:页面销毁后 getter/setter 未被取消和 ob 属性覆盖问题。相关 issue #71 ,后续相关问题在 #71 中跟进处理。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants