How to wait for request and user input?

Question

Let's say when a component loads I make an async request. That component also has a submit button that the user can press which triggers a function that relies on the result of that original request. How do I delay executing the triggered function until the async request is finished?

If that doesn't make sense let me give an example. MyComponent makes an async request getRandomColor() on mounted. MyComponent's template has <button @click="handleClick">. handleClick calls some function saveColor(). How do I make sure that saveColor() is not called until my async getRandomColor() is finished?

I'm currently using Vue.js but I think this question applies to all of javascript.