2017-02-11 9 views
11

मैं कुछ svg तत्वों के साथ काम कर रहा हूँ में Redux समारोह क्लिक करें और मैं एक वेतन वृद्धि बटन का निर्माण किया है।incrementing एक सरणी

वृद्धि बटन path d मानों को एक सरणी में परिवर्तित करता है और सरणी के तीसरे तत्व से 5 पर रकम करता है। तत्व 'L' या 'M' है यह कुछ भी नहीं

यहाँ redux में क्लिक समारोह करता है, यह incrementing कार्रवाई राज्य

const a = action.index; 
    let string = state[a].d; 

यह एक सरणी

let array = string.split(" "); 

में धर्मान्तरित के मूल्यों लेता है और फिर यह लूप

में सभी गणना करता है जो पूर्ण रेडक्स फ़ंक्शन

देखें जब मैं डिबग यह http://www.fastswf.com/uSBU68E

के रूप में आप कोड सही गणना करता है और उसे चौथे तत्व से 5 का योग है और यह संख्या 331 लौटा रहा है देख सकते हैं

switch(action.type) { 
    case 'INCREMENT_COORDINATES' : 
     console.log("incrementing coordinaates") 
     const a = action.index; 
     let string = state[a].d; 
     let array = string.split(" "); 
     let max = array.length; 
     let i = 3; 
     let click =() => { 
     i++; 
     if (i === max) i = 3; 
     if (array[i] !== 'M' && array[i] !== 'L') array[i] = parseInt(array[i]) + 5; 
     array.join(' '); 
     }; 
     return [ 
     ...state.slice(0,a), // before the one we are updating 
     {...state[a], d: click()}, // updating the with the click function 
     ...state.slice(a + 1), // after the one we are updating 
     ] 
    default: 
     return state; 
    } 

वीडियो डेमो देखें। तो सब अच्छा! लेकिन समस्या यह है कि मैं '331', सरणी पाश जारी रखने के लिए के एक नए तत्व के रूप में इसे वापस करने की जरूरत है।

मैं एक डेमो जो पूरी तरह से काम कर रहा है और कर रही है मैं क्या हासिल करना चाहते, एक ही कोड का उपयोग कर रहा है का निर्माण किया है! तो मुझे समझ नहीं आता मैं गलत क्या कर रहा हूँ जब मैं अपने redux समारोह में लागू करना होगा।

jsBin पूरी तरह से काम करने के रूप में देखें।

उत्तर

3

संपादित:

  1. आपका click समारोह कोई मूल्य वापस नहीं करता है, इसलिए array.join(' ') परिणाम कहीं भी निर्दिष्ट नहीं की गई और संपत्ति d असाइन नहीं किए गए बनी हुई है।

     
    let click =() => { 
        i++; 
        if (i === max) i = 3; 
        if (array[i] !== 'M' && array[i] !== 'L') array[i] = parseInt(array[i]) + 5; 
        return array.join(' '); 
    }; 
    
  2. हर बार increment_coordinates कार्रवाई शुरू हो जाती है, case 'INCREMENT_COORDINATES' : के बाद ब्लॉक में पूरे कोड निष्पादित। इस मामले महत्वपूर्ण में चर i है कि प्रत्येक एक नया वेरिएबल, 3. साथ प्रारंभ फोन में click समारोह, 4 करने के लिए i बढ़ जाती है और फिर इसे तो अपने मूल्य खो दिया है गुंजाइश है इसे से बाहर चला जाता है के निष्पादन के दौरान है।

    मेरे सुझाव state में वर्तमान सूचकांक शामिल करने के लिए है (उम्मीद है कि इस & काम करेगा मैं click समारोह को हटा दिया है के रूप में यह प्रत्येक कॉल है फिर से बनाया है और केवल एक बार लागू)

    लाइन में भी सूचकांक शामिल करने के लिए जहां पारित याद रखें अपने अपने कम करने के लिए पहली बार के लिए निर्देशांक या जाँच करें कि क्या state[a] संपत्ति index होता है और i=3 सेट नहीं तो।

     
    switch(action.type) { 
    case 'INCREMENT_COORDINATES' : 
        console.log("incrementing coordinaates") 
        const a = action.index; 
        let string = state[a].d; 
        let array = string.split(" "); 
        let max = array.length; 
        let i = (state[a].index || 3) + 1; 
        if (i === max) i = 3; 
        if (array[i] !== 'M' && array[i] !== 'L') array[i] = parseInt(array[i]) + 5; 
        return [ 
        ...state.slice(0,a), // before the one we are updating 
        {...state[a], d: array.join(' '); index: i}, // updating 
        ...state.slice(a + 1), // after the one we are updating 
        ] 
    default: 
        return state; 
    } 
    
+0

हाँ स्ट्रिंग में संख्या परिवर्तित मेरी समस्या है, क्या मैं गलत कर रहा हूँ नहीं है तो फिर? – Koala7

+1

अब मैं देखता हूं कि आपका फ़ंक्शन 'क्लिक' कोई मान वापस नहीं करता है, इसलिए 'd' का अद्यतन आइटम में कोई मान नहीं है। अपनी पिछली लाइन को 'return array.join (' ') पर बदलें; '। क्या यह आपकी समस्या को ठीक करता है? – barbsan

+0

सही, यह क्लिक फ़ंक्शन में array.join ('') का उद्देश्य है, डी पथ में नए मान पेस्ट करने के लिए, इस समय यह अनदेखा लगता है, जहां आप अंतिम पंक्ति का मतलब रखते हैं? इसे स्वीकार करने के लिए उत्तर अपडेट करें – Koala7