2017-11-08 7 views
2

アクションをディスパッチするのではなく、ストアの値を直接還元するとどうなりますか?ここではサンプルコードストアの値を直接更新しないのはなぜですか?

import actions from '../actions' 

class Example extends Component { 

    static contextTypes = { 
     store: PropTypes.any, 
    } 

    static propTypes = { 
     drawer: PropTypes.object, 
    } 

    componentDidMount() { 
     const { drawer } = this.props 
     const { store } = this.context 

     // I can update 'drawer' values directly and "it works" as following 
     // drawer.unread -= 1 

     // Also I can update 'drawer' values by dispatching an action as following 
     drawer.unread -= 1 
     this.context.store.dispatch(actions.updateDrawer(drawer)) 
    } 

} 


function mapStateToProps(state) { 
    return { 
     drawer: state.drawer, 
    } 
} 


export default connect(mapStateToProps)(Example) 
+1

'uiObjectProp'変更に再描画したい他のコンポーネントがある場合、ディスパッチを使用しない限り、それらは変更されません。状態は本当に変わることはありません。 – Daniel

+0

私はそう思ったが、彼らは変わる。私は遭遇した状況が例外的かどうかは疑問です。私は私の質問を更新します。 – efkan

+0

@efkan、面白いです。私のアプリの店の一部だった深く入れ子にされたオブジェクトで同じことを試してみましたが、何も起こらなかったし、ドキュメントごとに「その内部の状態を変更する唯一の方法は、アクションをディスパッチすることです。私は周りにフィドル! – semuzaboi

答えて

0

状態が変化するが、何の成分は変更が通知されません。

また、一部の最適化(React.PureComponentなど)は、浅い参照の等価性を使用して状態の変化を検出できると想定しています。直接割り当てを行うと、前提が解除されます。

+0

ただし、引き出しコンポーネントが変更されます。また、深いネストされたオブジェクトを更新しようとはしません。たぶんそれは、最初のレベルのオブジェクト(引き出しのような:{未読:3})上でのみ動作します – efkan

関連する問題