san-store默认值问题

[jiangjiu]

san-store默认值问题

引言

store中的属性有默认值是个很常见的场景，然而在业务中，大部分同学并不知道如何去搞，甚至在多个组件attached的时候触发action去添加默认值，既分散了状态，又写了很多无意义的代码。

究其原因可能是因为connect.san这个方法吧。

connect.san的问题

connect.san作为连接store实例和组件的桥梁，在业务开发中无疑是很好用的。

但是，这样的桥梁只能连san-store默认提供的store实例，无法在new Store()的时候传入初始值，导致了引言中的问题。

下一篇会说下如何自己手动new实例并connect，本篇只探讨默认值的初始化。

bad case

connect.san({username},{changeUsername})({
    template:`
        <div>{{username}}</div> 
    `,
    attached() {
        this.actions.changeUsername('zhangsiyuan')
    }
})

业务开发中，经常遇到这种写法。 明明username需要一个默认值，但是依赖这个属性的多个组件或实例都写在attached里面，谁先attached谁去触发。

另外一种极端场景，store中的username只是作为共享状态的缓存，也没有修改的需求，但是需要在各个依赖的组件attached时候触发actions，这是不需要的。

good case 1


const store = new Store({
    initData: {
         username:'erik'
     },
     actions:{
         changeUsername(name) {
             return builder().set('username', name);
         }
     }
})

第一种就是上述手动new一个store实例，不解释了。

good case 2

// actions.js
store.addActions('changeUsername',(name,{dispatch, getState}) => {
    ...
})

store.dispatch('changeUserName', 'erik');

目前的connect.san是可以通过直接dispatch来动态添加默认值的，也不需要在attached去搞。

总结

我厂的文档远不及技术水平。