How can I pass the results of wrapper class to aura component?

Question

How can I display the results of my wrapper class in aura component? The debug of my apex controller shows me the correct results, but I can't pass the results to my component.

COMPONENT

<aura:component controller="vlist" implements="force:flexipage:availableForAllPageTypes" access="global">        
    <aura:handler name="init" value="{!this}" action="{!c.doInIt}"/>
    <aura:attribute name="resultlist" type="object"/>
    <aura:attribute name="mycolumns" type="List"/>        
    <article class="slds-card">
        <div class="slds-box slds-theme_shade slds-p-around_none ">
            <div class="slds-text-title_bold slds-p-left_small slds-p-top_x-small slds-p-bottom_small">
                <lightning:icon iconName="standard:instore_locations" size="small" /> <strong class="slds-m-left--small">List</strong>
            </div>     
            <div class="slds-border_top slds-border_bottom slds-border_left slds-border_right">
                <aura:if isTrue="{!not(empty(v.resultlist))}">
                    <lightning:datatable data="{!v.resultlist}" 
                                         columns="{!v.mycolumns}" 
                                         keyField="Id"                                       
                                         hideCheckboxColumn="true"/>
                    <aura:set attribute="else">
                        <div Style="text-align : center">nothing</div>
                    </aura:set>
                </aura:if>  
            </div>
        </div> 
    </article>        
</aura:component>

COMPONENT CONTROLLER

({
    doInIt : function(component, event, helper) {
        component.set('v.mycolumns', [              
            {label: 'Account Id',   fieldName: 'AccId', type: 'text' },          
            {label: 'Account Name',     fieldName: 'AccName',   type: 'text' }, 
            {label: 'Count Opp',    fieldName: 'MyOppCount',    type: 'decimal' },      
        ]);
            var action = component.get("c.vlist");                
            action.setCallback(this, function(response) {
                var state = response.getState();
                if(state === "SUCCESS") {
                    var response = response.getReturnValue();         
                    component.set("v.resultlist", response);
                } else if(state === "INCOMPLETE") {
                    //do something 
                } else if(state === "ERROR") {
                    var error = response.getError();
                    if(error) {
                        console.log("error"+error);
                    }
                }
            });
            $A.enqueueAction(action);
    },                       
})

APEX CONTROLLER

public class vlist {
    
    @AuraEnabled
    Public List<ResultWrapper> resultList   {get; set;}
           
    public class ResultWrapper{  
        @AuraEnabled
        public Id       AccId                   {get; set;}
        @AuraEnabled
        public String   AccName                 {get; set;}
        @AuraEnabled
        public Decimal  MyOppCount              {get; set;}         
    }    
            
    @auraEnabled
    public static List<AccList> vlist() { 

        Decimal MyTotalCount            = 0;                  
        Map<Id, ResultWrapper> mapAccountIdToWrapper = new Map<Id, ResultWrapper>();            
        Set<Id> accountIds = new Set<Id>();             
        List<ResultWrapper> ResultList = new List <ResultWrapper>();
        List<AccList> AccList2  = new List<AccList>();
       
        for (Account acc : [SELECT Id, Name, BillingCity, Owner.Name, Owner.Id FROM Account WHERE ORDER BY Name]) {
               accountIds.add(acc.Id);
                ResultWrapper wrap                  = new ResultWrapper();
                wrap.AccId                          = acc.Id;
                wrap.AccName                        = acc.Name + ', ' + acc.BillingCity;
                mapAccountIdToWrapper.put(wrap.AccId, wrap);
        }            
        for(AggregateResult MYoppAr :[SELECT AccountId AccId, Count(Name) MyOppCount FROM Opportunity WHERE AccountId IN :accountIds GROUP BY AccountId]) {
                Id accountId                        = (Id) MYoppAr.get('AccId');
                ResultWrapper combinedResult        = mapAccountIdToWrapper.get(accountId);
                MyTotalCount                        = MyTotalCount + (Decimal)MYoppAR.get('MyOppCount');
                combinedResult.MyOppCount           = (Decimal)MYoppAR.get('MyOppCount');

        }
        resultList = mapAccountIdToWrapper.values();
    //return null;          
    return AccList2;
    }

public class AccList {
    @AuraEnabled
    public String AccId_out     {get; set;}        
    @AuraEnabled
    public String AccName_out       {get; set;}        
    @AuraEnabled
    public Decimal MyOppCount_out       {get; set;}                
    
    public AccList(String AccId, String AccName, Decimal MyOppCount) {
        AccId_out               = AccId;
        AccName_out             = AccName;
        MyOppCount_out          = MyOppCount;
    }
}  
}

Answer 1

I think the problem is you are using List of AccList as return type of your function.But you are returning List of ResultWrapper. Update the return type of your function and see if it works or not. Also you are not returning anything. Return resultList from the method as well.