Access the List<String> in wrapper class to LWC

Question

I have a wrapper class in my apex controller.

global without sharing  class Homepage_Ctrl {

    public static List<variableDTO> dtoList = new List<variableDTO>();
    public static variableDTO dto = new variableDTO();

      @AuraEnabled(cacheable=true)
        public static List<variableDTO> getAllDTOs() {
            initErrors();
            dto.updateKm = false;
            dto.agendaActivable = true;
            getTimeLineMonths();
            dtoList.add(dto);
            System.debug(dtoList);
            return dtoList;
        }

    @AuraEnabled(cacheable=true)
        public static void getTimeLineMonths(){
            dto.monthListBefore = new List<String>();
            dto.monthListAfter = new List<String>();
            dto.monthNameMap = new Map<Integer,String>();
            dto.monthNameMap.put(1,Label.CP_MonthJAN.substring(0,3));
            dto.monthNameMap.put(2,Label.CP_MonthFEB.substring(0,3));
            dto.monthNameMap.put(3,Label.CP_MonthMAR.substring(0,3));
            dto.monthNameMap.put(4,Label.CP_MonthAPR.substring(0,3));
            dto.monthNameMap.put(5,Label.CP_MonthMAY.substring(0,3));
            dto.monthNameMap.put(6,Label.CP_MonthJUN.substring(0,3));
            dto.monthNameMap.put(7,Label.CP_MonthJUL.substring(0,3));
            dto.monthNameMap.put(8,Label.CP_MonthAUG.substring(0,3));
            dto.monthNameMap.put(9,Label.CP_MonthSEP.substring(0,3));
            dto.monthNameMap.put(10,Label.CP_MonthOCT.substring(0,3));
            dto.monthNameMap.put(11,Label.CP_MonthNOV.substring(0,3));
            dto.monthNameMap.put(12,Label.CP_MonthDEC.substring(0,3));
            Integer i;

            Date currentDate = System.today().addDays(20);
            for(i=MONTHS_BEFORE;i>0;i--){
                Integer month = currentDate.addMonths(-i).month();
                String monthName = dto.monthNameMap.get(month);
                dto.monthListBefore.add(monthName);
            }
            Integer monthTodayInteger = currentDate.month();
            dto.monthToday = dto.monthNameMap.get(monthTodayInteger);
            for(i=1;i<MONTHS_AFTER+1;i++){
                Integer month = currentDate.addMonths(i).month();
                String monthName = dto.monthNameMap.get(month);
                dto.monthListAfter.add(monthName);
            }
            dto.startDateTLE = currentDate.addMonths(-MONTHS_BEFORE);
            dto.endDateTLE = currentDate.addMonths(MONTHS_AFTER);

            Integer daysInCurrentMonth = Date.daysInMonth(currentDate.year(),currentDate.month());
            Double tempValue = -(TIMELINE_WIDTH / 19) * (currentDate.day() *1.0) / (daysInCurrentMonth * 1.0);
            dto.currentDateMoveOnTL = 'left:'+Math.round(tempValue) + 'px';

        }

global class variableDTO {
            @AuraEnabled
            public String bkImgURL { get; set; }
            @AuraEnabled
            public List<String> monthListBefore {get; set;}
    }
}

And I am trying to access the monthListBefore list in LWC. My code is below.

@track background; 
@track MonthList;

    @wire(getAllDTOs) wrappers ({
            error,
            data
        }) {
            if(data) {
                this.objects = data;
                this.background = data[0].bkImgURL;
                this.MonthList = data[0].MonthListBefore;
                console.log(this.background );
                console.log(this.MonthList );


            } else {
                this.error = error;
            }
        }

Here I got value for this.background but I got undefined for this.MonthList. Is there anything wrong with my code?

I got value MonthListBefore in json when I debug.

"monthListBefore":[ 
"Avr",
"Mai",
"Jui",
"Jui",
"Aoû",
"Sep",
"Oct",
"Nov",
"Déc"
],

Please help me to solve this issue. Thank You.

Answer 1

Javascript is case SEnSiTivE. You have defined variable in apex as monthListBefore but in JS you are trying to access MonthListBefore, which does not exist.

So, Try

this.MonthList = data[0].monthListBefore;