[1.0.0-beta13] Async options with Promises displays [object Promise] as input value
See original GitHub issueWhen loading options async with Promises, like in the example [object Promise]
string is set as input value of Select
const getOptions = (input) => {
return fetch(`/users/${input}.json`)
.then((response) => {
return response.json();
}).then((json) => {
return { options: json };
});
}
<Select.Async
loadOptions={getOptions}
/>
It is because of #907.
loadOptions
from Async component attaches to onInputChange
on Select component.
so this
if (this.state.inputValue !== event.target.value && this.props.onInputChange) {
let nextState = this.props.onInputChange(newInputValue);
if (nextState != null) {
newInputValue = '' + nextState;
}
}
sets newInputValue to return value of loadOptions, which is [object Promise]
Issue Analytics
- State:
- Created 7 years ago
- Reactions:4
- Comments:15 (6 by maintainers)
Top Results From Across the Web
Async function returns [object Promise] instead of the real value
Async functions would always return a Promise . Promises may be resolved or rejected. You can handle promises in the following ways:.
Read more >Promise - JavaScript - MDN Web Docs
The Promise object represents the eventual completion (or failure) of an asynchronous operation and its resulting value.
Read more >Why am I getting [object Promise] when calling async function ...
Why? You are getting [object Promise] as value because you are calling an asynchronous function inside a synchronous code. This means the ...
Read more >$q - AngularJS: API
function asyncGreet(name) { // perform some asynchronous operation, resolve or reject the promise when appropriate. return $q(function(resolve, reject) ...
Read more >NetSuite Applications Suite - Promise Object
With promises, developers can write asynchronous code that is intuitive and efficient. A promise holds one of the following values: fulfilled – The...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@JedWatson any time frame on when this might get released? I’m not familiar with the release cadence but would love to use fetch + react-select for async options!
@VladimirPal I’m closer… I was using this example code, which doesn’t seem to work:
and now am using something like this:
This still isn’t quite working, but am not getting the [object Promise] in select window.
The optionRenderer is only firing on first character, even though I can see elements coming back