V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
gzf6
V2EX  ›  Vue.js

[请教] vue3 自定义简单的状态管理

  •  
  •   gzf6 · 2021-06-25 17:00:52 +08:00 · 2187 次点击
    这是一个创建于 1281 天前的主题,其中的信息可能已经有所发展或是发生改变。

    之前用 vuex4 倒是实现了和 ts 的结合,但是代码太繁琐,vuex5 遥遥无期,我就想用单例的数据共享和 vue3 的响应数据搞个简化版的,想问问这么写有没有什么坑?

    class _Store {
      ...
      
      private _name = ref('a');
      public get name() {
        return readonly(this._name);
      }
      public setName = (v: string) => {
        this._name.value = v;
      };
    
      private _person = reactive({ name: 'test', age: 12 });
      public get person() {
        return readonly(this._person);
      }
      public setPerson = (v?: { name?: string; age?: number }) => {
        v && Object.assign(this._person, v);
      };
      
      ...
    }
    
    10 条回复    2021-06-28 09:17:40 +08:00
    powerfulyang
        1
    powerfulyang  
       2021-06-25 17:26:48 +08:00
    mark 。我也是这样写的 也想知道
    wednesdayco
        2
    wednesdayco  
       2021-06-25 17:57:18 +08:00
    支持!
    faceRollingKB
        3
    faceRollingKB  
       2021-06-25 18:52:10 +08:00
    get 和 set 无法跟 template 双向绑定,使用$watch 来模拟 computed 和 watch
    CokeMine
        4
    CokeMine  
       2021-06-26 11:14:46 +08:00 via Android
    感觉你说的应该类似于这个 https://www.zhihu.com/answer/1188185176
    尤大在这个回复评论的是“完全单例且不需要 SSR 就可以”
    doommm
        5
    doommm  
       2021-06-27 10:42:33 +08:00
    目前我是直接用一个叫 pinia 的库 https://pinia.esm.dev/introduction.html
    IndexXuan
        6
    IndexXuan  
       2021-06-27 12:54:42 +08:00 via iPhone
    写个 useGlobalState 即可
    gzf6
        7
    gzf6  
    OP
       2021-06-27 15:58:16 +08:00
    @faceRollingKB 嗯,原则上 store 里的数据禁止双向绑定,可以自定义 computed 的 get 和 set 之类的实现
    gzf6
        8
    gzf6  
    OP
       2021-06-27 15:59:16 +08:00
    @CokeMine 😄感觉越写越像 ng
    gzf6
        9
    gzf6  
    OP
       2021-06-27 16:12:12 +08:00
    @doommm 看了一下,好像和 vuex5 设计的 api 差不多
    sjhhjx0122
        10
    sjhhjx0122  
       2021-06-28 09:17:40 +08:00
    目前在使用 pinia,说是根据 vuex5 提案来的,
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2600 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 05:25 · PVG 13:25 · LAX 21:25 · JFK 00:25
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.