Quantcast
Channel: Active questions tagged react-native+ios - Stack Overflow
Viewing all articles
Browse latest Browse all 16750

Promise: .then() not getting called when returning promise from React Native Component Prop Function

$
0
0

I have a react native component like below:

export const SearchBar = (props: SearchListProps) => {  const {    data,    matchingFunction,    listItemVariant,    onChange,    onSubmit,    renderItem,    ...rest  } = props;  const animatedValue = useRef(new Animated.Value(0));  const [searchValue, setSearchValue] = useState('');  const [isFocused, setFocused] = useState(false);  const listData = useRef([...data]);  if (isFocused) {    Animated.timing(animatedValue.current, {      duration: 100,      toValue: 1,      useNativeDriver: true,    }).start();  }  useEffect(() => {    const promise = props?.dataSource(searchValue);    console.log('RETURNED: '+ JSON.stringify(promise));    promise      .then((result: any) => {        console.log('RESULT: '+ JSON.stringify(result));      })      .catch((e) => console.log(e));  }, [searchValue]);//... rest of the code

Then I'm using this component somewhere like this:

<SearchBar        listItemVariant={'withImage'}        dataSource={async (query?: string) => {          console.log('Query Passed: '+ query);          return new Promise<ListItem[]>((resolve, _) => {            resolve([              {                title: 'Paneer Bhurji',                subTitle: 'Delicious',                imageSource:'https://homepages.cae.wisc.edu/~ece533/images/peppers.png',              },              { title: 'Paneer Butter Masala', subTitle: 'High Protein' },              {                title: 'Chicken',                imageSource:'https://homepages.cae.wisc.edu/~ece533/images/peppers.png',              },            ]);          });        }}// ...rest of the code

Problem is that .then() is not being called in the component.Console prints the following statements:

  1. Query Passed:
  2. RETURNED: {}

I'm not sure why {} is being returned when I'm returning a promise which contains some data.

Other logs (inside useEffect's .then() ) are not getting printed.So essentially, .then() method is never being called.


Viewing all articles
Browse latest Browse all 16750

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>