इसलिए मुझे यह कहते हुए एक त्रुटि हो रही है कि .map अपरिभाषित है क्योंकि मैं यह मान रहा हूँ कि यह.props.action समाप्त नहीं हुआ है और इसलिए .map कुछ भी मैप करने में असमर्थ है।

कम करने

 case GET_DEALERSHIP_GOAL_TYPE_SUCCESS:
      return Object.assign({}, state, {
        loading: false,
        dealershipGoalType: action.payload.data
      });

MapStateToProps

const mapStateToProps = state => ({
  dealershipGoalType: state.DealerPreferencesReducer.dealershipGoalType,
});

कंपोनेंटडिडमाउंट

  componentDidMount = () => {
      this.props.actions.getDealershipGoalType(this.state.prevId, this.state.year)
  };

प्रस्तुत करना

render = () => {

 let {dealershipGoalType } = this.props;
}

नक्शा अनुभाग

  {dealershipGoalType.map(goal => (
      <option value={goal.type_goal}>
        {goal.label}
      </option>
  ))}

कोई विचार?

1
user13532287 18 अगस्त 2020, 11:51

2 जवाब

सबसे बढ़िया उत्तर

आप dealershipGoalType की प्रारंभिक स्थिति को एक खाली सरणी के रूप में निर्दिष्ट कर सकते हैं, इसके अलावा मैं आपको एक खाली पाठ या किसी प्रकार का लोडर दिखाने का सुझाव दूंगा जब तक कि आपको dealershipGoalType में कुछ भी न मिल जाए।

{
  dealershipGoalType.length > 0 ?
   dealershipGoalType.map(goal => (
    <option value={goal.type_goal}>
     {goal.label}
    </option>
  )
 : <span> There are no listings! </span>
}
1
Awais Rafiq Chaudhry 18 अगस्त 2020, 12:05

आप ES2020 में सामने आए Nullish Coalescing Operator का उपयोग कर सकते हैं। अपने रेंडर में, उपयोग करें

let dealershipGoalType = this.props.dealershipGoalType ?? [];

इस प्रकार यदि डीलरशिपगोलटाइप खाली है, तो यह कोड को तोड़े बिना स्वचालित रूप से एक खाली सरणी डीलरशिपगोलटाइप असाइन करेगा। इसके अलावा, यह इस समस्या को पूरा करने के लिए लिखे जाने वाले कोड की मात्रा को कम करता है और कोड को भी साफ दिखता है।

आप इसके बारे में यहां पढ़ सकते हैं।

0
Saad Awan 18 अगस्त 2020, 12:08