Closed matejlauko closed 8 years ago
I've got the same error. https://github.com/VladimirPal/react-select/tree/async_promise_bug - here i've added example with fetch.js + bug fixing
@VladimirPal thx for the fix
Fixed by #941, thanks @VladimirPal!
And thanks @matejlauko for the comprehensive report too :)
I'm running 1.0.0-beta13 and am still experiencing this bug.
@dvreed77 Currently this fix only in master branch
maybe dumb question, but can I force use this branch from npm?
Try this:
"react-select": "git+ssh://git@github.com:JedWatson/react-select.git"
@dvreed77 But it will not help you:( You have to build lib folder manually.
cd node_modules/react-select
npm install && npm build
@VladimirPal Was battling some corporate proxy stuff there for a second. I followed all that, but am still getting the [object Promise] in Select.
Only difference is I used http protocal vs ssh: "react-select": "git+https://github.com/JedWatson/react-select.git"
@dvreed77 i've created builded version, try use it:
"git+https://github.com/VladimirPal/react-select.git"
I get this:
gulp-babel@5.3.0 node_modules/react-select/node_modules/gulp-babel
- babelify@6.4.0 node_modules/react-select/node_modules/babelify
- react-component-gulp-tasks@0.7.7 node_modules/react-select/node_modules/react-component-gulp-tasks
- babel-eslint@4.1.8 node_modules/react-select/node_modules/babel-eslint
- babel@5.8.38 node_modules/react-select/node_modules/babel
- react-select@1.0.0-beta13 node_modules/react-select/node_modules/react-select
orgchart@1.0.0 /Users/dreed/Projects/orgchart
├── react@15.0.2 extraneous
├── react-dom@15.0.2 extraneous
├── react-select@1.0.0-beta13 invalid (git+https://github.com/VladimirPal/react-select.git#acb3a69464dfe66edf00faef2b7fbebac2f9ddb5)
└── reactify@1.1.1 extraneous
npm WARN orgchart@1.0.0 No description
npm WARN orgchart@1.0.0 No repository field.
Note the invalid error
Also am trying it without browserify and including the .js and .css from /dist directory and am still getting same issue
@VladimirPal I'm closer... I was using this example code, which doesn't seem to work:
const getOptions = (input) => {
return fetch(`/users/${input}.json`)
.then((response) => {
return response.json();
}).then((json) => {
return { options: json };
});
}
<Select.Async
name="form-field-name"
value="one"
loadOptions={getOptions}
/>
and now am using something like this:
getUsers: function (input, callback) {
console.log(input);
fetch(`/users/${input}.json`)
.then(function(response) {
return response.json()
})
.then(function(json) {
var data = {
options: json,
complete: false
};
callback(null, data);
});
},
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
ok, even closer: had to set filterOption={function(){ return true; }}
to just pass through
@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!
When loading options async with Promises, like in the example
[object Promise]
string is set as input value of SelectIt is because of #907.
loadOptions
from Async component attaches toonInputChange
on Select component. so thissets newInputValue to return value of loadOptions, which is
[object Promise]