Redux: प्रश्न: एक राज्य में एक रेड्यूसर में एक आंतरिक वस्तु का उत्परिवर्तन

को निर्मित 15 अप्रैल 2016 · 3टिप्पणियाँ · स्रोत: reduxjs/redux

क्या यह एक वैध रेडक्स रेड्यूसर है?

function reducer(state={ byId: {}, ids: [] }, action) {
  switch (action.type) {
    case 'ADD':
      state = { ...state }
      state.byId[action.id] = action.value
      state.ids.push(action.id)
      return state

    default:
      return state
  }
}

पूरे राज्य को पहले उथले क्लोन किया जाता है, इसलिए एक नई वस्तु वापस कर दी जाएगी, लेकिन आंतरिक वस्तुएं वही रहती हैं और उत्परिवर्तित होती हैं।

या क्या मुझे कुछ ऐसा करना है:

function reducer(state={ byId: {}, ids: [] }, action) {
  switch (action.type) {
    case 'ADD':
      return {
        ...state,
        byId: {
          ...state.byId,
          [action.id]: action.value
        },
        ids: [ ...state.ids, action.id ]
      }

    default:
      return state
  }
}

पहले दृष्टिकोण के साथ मुझे जो दुष्प्रभाव दिखाई दे रहे हैं, वे DevTools LogMonitor में हैं:

पिछली स्थिति में एक उप-नोड (जैसे byId ) का विस्तार करना नवीनतम के समान मान दिखाएगा, भले ही यह पहले कुछ और था
समय यात्रा काम नहीं कर रही है

क्या यह LogMonitor में सिर्फ एक बग है या दूसरा तरीका सही है? यदि मैं उत्परिवर्तन से पहले state = _.cloneDeep(state) जोड़ता हूं तो यह वास्तव में ठीक काम करता है, यह साबित करता है कि LogMonitor समान वस्तुओं का पुन: उपयोग करता है, इसलिए समान मान।

बाकी ऐप ठीक काम करता है और @connect एड व्यू सही तरीके से अपडेट होते हैं।

स्रोत

elado

सबसे उपयोगी टिप्पणी

बाद वाला उदाहरण वह है जो आपको करने की आवश्यकता है। जाहिर है, अगर आप चीजों को घोंसला बना रहे हैं तो यह कुछ हद तक वर्बोज़ हो सकता है। कई उपयोगिता पुस्तकालय हैं जो आपके लिए इसे अमूर्त करने का प्रयास करते हैं, और मैंने उनमें से कुछ को मेरी Redux पुस्तकालयों की सूची के अपरिवर्तनीय डेटा पृष्ठ पर सूचीबद्ध किया है।

साथ ही रेड्यूसर कंपोजिशन इसमें मदद करता है।

function byId(state = {}, action) {
  switch (action.type) {
    case 'ADD':
      return {
        ...state,
        [action.id]: action.value
      }
    default:
      return state
  }
}

function ids(state = [], action) {
  switch (action.type) {
    case 'ADD':
      return [ ...state, action.id ]
    default:
      return state
  }
}

const reducer = combineReducers({
  byId,
  ids
})

gaearon 16 अप्रैल 2016

👍2

सभी 3 टिप्पणियाँ

नहीं, वह पहला उदाहरण राज्य को पूरी तरह से बदल रहा है। प्रारंभिक उथली प्रतिलिपि एक नई वस्तु बनाती है, लेकिन नई वस्तु मूल के समान byId और ids संदर्भों की ओर इशारा करती है। इसलिए, जब आप byId[action.id] = action.value और ids.push(action.id) करते हैं, तो आप मूल आइटम को बदल रहे होते हैं।

बाद वाला उदाहरण वह है जो आपको करने की आवश्यकता है। जाहिर है, अगर आप चीजों को घोंसला बना रहे हैं तो यह कुछ हद तक वर्बोज़ हो सकता है। कई उपयोगिता पुस्तकालय हैं जो आपके लिए इसे अमूर्त करने का प्रयास करते हैं, और मैंने उनमें से कुछ को मेरी Redux पुस्तकालयों की सूची के अपरिवर्तनीय डेटा पृष्ठ पर सूचीबद्ध किया है।

Redux FAQ में एक प्रश्न भी है जो अपरिवर्तनीय रूप से सही ढंग से अद्यतन करने की स्थिति को कवर करता है: http://redux.js.org/docs/FAQ.html#react -not-rerendering।

markerikson 15 अप्रैल 2016

👍1

बाद वाला उदाहरण वह है जो आपको करने की आवश्यकता है। जाहिर है, अगर आप चीजों को घोंसला बना रहे हैं तो यह कुछ हद तक वर्बोज़ हो सकता है। कई उपयोगिता पुस्तकालय हैं जो आपके लिए इसे अमूर्त करने का प्रयास करते हैं, और मैंने उनमें से कुछ को मेरी Redux पुस्तकालयों की सूची के अपरिवर्तनीय डेटा पृष्ठ पर सूचीबद्ध किया है।

साथ ही रेड्यूसर कंपोजिशन इसमें मदद करता है।

function byId(state = {}, action) {
  switch (action.type) {
    case 'ADD':
      return {
        ...state,
        [action.id]: action.value
      }
    default:
      return state
  }
}

function ids(state = [], action) {
  switch (action.type) {
    case 'ADD':
      return [ ...state, action.id ]
    default:
      return state
  }
}

const reducer = combineReducers({
  byId,
  ids
})

gaearon 16 अप्रैल 2016

👍2

@gaearon @markerikson धन्यवाद। मैंने एक उच्च-आदेश-रेड्यूसर लिखना समाप्त कर दिया जो गतिशील अनुक्रमित सूचियों का प्रबंधन करता है (आईडी द्वारा)

कोड: https://gist.github.com/elado/95484b754f31fcd6846c7e75de4aafe4

elado 19 अप्रैल 2016

क्या यह पृष्ठ उपयोगी था?

0 / 5 - 0 रेटिंग्स

Redux: प्रश्न: एक राज्य में एक रेड्यूसर में एक आंतरिक वस्तु का उत्परिवर्तन

सबसे उपयोगी टिप्पणी

सभी 3 टिप्पणियाँ

संबंधित मुद्दों