vue.js - Vue js - not all the data showing after store dispatch

Question

The select box not showing sometimes the first color and sometimes not showing the first color. How can i make it to show all the item in the select box? I'm not getting for some reason all the promises

You can see the issue in the picture Please help me to fix this issue i'm new to vue js

My code:

data() {
        return {
            propertiesTree: []
  }
}
getPropertyGroups(objectId: number): void {
            if (this.$data.currentObjectId === objectId)
                return;

            let component: any = this;

            this.$data.currentObjectId = objectId;

            component.showLoader();
            this.$store.dispatch('properties/getPropertyGroups', objectId)
                .then(({ data, status }: { data: string | Array<propertiesInterfaces.PropertyGroupDto>, status: number }) => {

                    // console.log(data, "data");
                    // console.log(status, "status")
                    if (status === 500) {
                        this.$message({
                            message: data as string,
                            type: "error"
                        });
                    }
                    else {
                        let anyData = data as any;
                        anyData.map(item => {
                            item.properties.map(prop => {
                                if(prop.type.toString() === 'dictionary'){
                                    prop.dictionaryList = [];
                                    prop.color = '';
                                    this.getWholeDictionaryList(prop.dictionaryId.value, prop)
                                }
                            });
                        });
              
                    }
                    component.hideLoader();
                });
        },
        getWholeDictionaryList(dictionaryId: number, prop: any){
            this.$store.dispatch('dictionaries/getWholeDictionaryList', dictionaryId).then(
                ({ data, status }: { data: Array<any> |string , status: number })  => {
                if (status === 500) {
                    this.$message({
                        message: data as string,
                        type: "error"
                    });
                } else {
                    const arrData = data as Array<any>;
                    arrData.map((item,index) => {
                        prop.dictionaryList = [];
                        prop.dictionaryList = data;                 
                        this.getDictionaryItemColor(item.id.value, data, index, prop);
                    });
                }
            });
        },
        getDictionaryItemColor(dictionaryItemId:number, dictionaryList: Array<any>, index:number, current){
            this.$store.dispatch('patterns/getDictionaryItemColor', dictionaryItemId).then((data: any, status: number) => {
                if (status === 500) {
                    this.$message({
                        message: data as string,
                        type: "error"
                    });
                } else{
                    debugger
                    if(current.dictionaryItemId.value === data.data.sceneObjectId)
                    current.color = data.data.colorString;
                     dictionaryList[index].color = data.data.colorString ? data.data.colorString: '#FFFFFF';

                }
            });
        },

Html code of the select box

  <el-select v-model="data.color" placeholder="Select">
    <el-option
      v-for="item in data.dictionaryList"
      :key="item.name"
      :label="item.color"
      :value="item.color">
    </el-option>
  </el-select>

Answer 1

I did return to dispatch

let dispatch = this.getWholeDictionaryList(prop.dictionaryId.value, prop)
let promiseArr = [];

promiseArr.push(dispatch); after the map closing tag i did

Promise.all(promisArr).then( () => {
                                        debugger
                                        this.$data.propertiesTree = anyData;
                                    });

And I've got it solved