Despite having a result, the Promise is returning an undefined value

In Vuejs, I have a method named getUsers that takes an array as input and fetches user data from the database.

When calling it like this, it successfully returns the results:

this.getUsers(executives).then(
          result => {
            this.specifcExecs = result;
          });

To avoid repetitive calls to getUsers with different inputs, I decided to create a common method to directly assign values to specific arrays, as shown below:

this.specifcExecs = this.populateList(executives);

populateList(list){
      this.getUsers(list).then(
              result=> {
                  console.log("inside result in", result);
                  return result;
              }); 
    },

However, when trying to print this.specifcExecs, I receive undefined. Can someone help me understand what I am doing wrong here? I am looking for a way to efficiently handle promises and prevent code duplication.

Answer №1

Although promises don't allow you to directly return a value, here's a way to achieve the desired functionality:


  this.displayExecutives(executiveList);

displayExecutives(list){
      this.fetchUsers(list).then(
              response=> {
                  console.log("Received result", response);
                  this.filteredExecutives = response;
              }); 
    },

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Can you please explain how I can retrieve information from a Firebase collection using the NextJs API, Firebase Firestore, axios, and TypeScript?

I'm currently utilizing api routes within NextJS 13 to retrieve data from Firebase. The code for this can be found in api/locations.tsx: import { db } from "../../firebase"; import { collection, getDocs } from "firebase/firestore"; ...

Searching for TypeScript type definitions for the @Angular libraries within Angular 2

After updating my application to Angular2 v2.0.0-rc.1, I am encountering TypeScript compile errors and warnings when webpack bundles my application. These messages appear for any @angular packages referenced in my TypeScript source files: ERROR in ./src/a ...

Ways to prevent a variable from syncing in Nuxt

I have a function called asyncData that returns a variable: async asyncData({ redirect, params, store }) { The returned variable is: return { camera: c, After returning the variable, I attempt to clone it in the created hook like this: creat ...

Can Vue components accept query parameters as properties?

How can query parameters be taken in vuejs2 & vue-router3 and passed into the props of a route component? Additionally, how can the query string be removed from the URL? This functionality is needed to facilitate opening a link in a new window. ...

Changing the color of an open Bootstrap 4 accordion panel when the page loads

I am looking to emphasize the panel that the user has opened. If a user clicks the button in the card header, the background turns red, which is working smoothly as demonstrated in the code snippet. In certain scenarios, the first panel is open by default ...

Ways to verify the value of a v-model object

Hey there, I'm a newcomer to Vue. Currently, I am working with Vue version 2.6.10 and element-ui version 2.12.0. Below is the response data from my API: API RESULT [ { name: 'Test', age: 18, cash: null, }, ...

Is there a way for me to adjust the font size across the entire page?

Most CSS classes come with a fixed font-size value already set. For instance: font-size: 16px font-size: 14px etc. Is there a way to increase the font size of the entire page by 110%? For example, font-size: 16px -> 17.6 font-size: 14px -> 15.4 ...

JavaScript script to modify the parameter 'top' upon clicking

Here is the pen I've made. HTML <div class = 'cc'> <div class = 'bb'><div class = 'aa'> Some word </div></div> </div> CSS .cc { width: 100%; min-height: 90px; margin: 0; ...

Is it possible to determine the total number of pages in a PDF using PDF.js in

Is there a way to retrieve the total page count using pdf.js? <script type="text/javascript"> $( document ).ready(function() { var pdf = pdfjs.getDocument('sample.pdf'); alert(pdf.numPages); }); </script> ...

Tips for automatically resizing a canvas to fit the content within a scrollable container?

I have integrated PDF JS into my Vue3 project to overlay a <canvas id="draw_canvas"> on the rendered pdf document. This allows me to draw rectangles programmatically over the pdf, serving as markers for specific areas. The rendering proces ...

Retrieve the next 14 days starting from the current date by utilizing Moment.js

Looking to display the next 14 days in a React Native app starting from today's date. For example, if today is Friday the 26th, the list of days should be: 26 - today 27 - Saturday 28 - Sunday 01 - Monday 02 - Tuesday ............ 12 - Friday Is ther ...

Displaying a div when hovering over it, and keeping it visible until clicked

I want to display a div when hovering over a button. The shown div should be clickable and persistent even if I move the cursor from the button into the shown div. However, it should be hidden when moving out of the entire area. I'm unsure about how ...

What is the best way to find the longest element with the same class name using jQuery?

How can I dynamically find elements with the same length of class names? var className = $('.floor-4').attr('class').split(' ')[1]; var classLength = $('.' + className).length; Here is the HTML code: <div id="d ...

Attempting to employ the .reduce method on an object

Currently, I am faced with the task of summing a nested value for all objects within an object. The structure of my object is as follows: const json = [ { "other_sum": "1", "summary": { "calculations" ...

Is there a way to disregard the data returned from previous AJAX calls?

I've been wondering about a strategy for managing delayed AJAX data returns in a scenario where newer calls should take precedence over earlier ones. For instance, if a first data fetch initiated at 12:01:33 is delayed and comes back at 12:01;39, whil ...

Working with JavaScript Events within an Iframe

Is it possible to link an onclick event to an IFrame? I attempted using the HTML attribute, but that approach was unsuccessful. Next, I enclosed it within a div, which also did not work. Finally, I tried setting up a jQuery event handler, only to encounte ...

Implementing an inline cache for <script> tags that load AJAX content

Looking for a way to cache <script src> received through AJAX requests? Currently, each call attempts to load the src via AJAX by default. However, the issue is that this script remains constant throughout the session and only needs to be re-evaluate ...

Listening for server updates with jQuery

I am currently working on a web application that communicates with a server for database updates. The issue I am facing is that the update process can vary greatly in time, ranging from milliseconds to tens of seconds for larger updates. I would like to im ...

Unable to close Bootstrap sidebar menu on mobile devices

I implemented a sidebar menu for mobile that opens when you click on the hamburger icon, with a dark overlay covering the body. The issue I encountered is that on mobile devices, the visibility of the menu does not change when clicked outside of it. It wor ...

Gulp encountered an issue - TypeError: When attempting to call the 'match' method, it was found to be undefined

Currently, I'm attempting to utilize Gulp alongside BrowserSync for a website that is being hosted on MAMP and proxied through localhost:8888. Unfortunately, upon running gulp, I encounter the following error: [17:38:48] Starting 'browser-sync& ...