CODEWITHSUNDEEP
react-nativejsx
hesam sameni
hesam sameni

Reputation: 151

Sending API request in react native after something is searched in searchbar (react-native-elements)

I have a react native search bar and I need to make an api call with the data user typed in the searchbar . but because I do not have a database on mobile device I want to make the request only if user hit search button ( not while user is typing ) and while we are on that area I also need to know how can I change the font for the placeholder in the searchbar

here is my searchbar code:

  <SearchBar
        placeholder="Something..."
        round
        containerStyle={{
        backgroundColor: 'transparent',
        width: '70%',
        borderTopWidth: 0,
        borderBottomWidth: 0
      }}
        inputContainerStyle={{
        backgroundColor: '#fff'
      }}
        cancelButtonProps={{
        color: '#fff'
      }}/>

Upvotes: 1

Views: 647

Answers (1)

akcoban
akcoban

Reputation: 973

For question 1

That's not designed with the search button. Of course you can add anywhere a custom button but I don't recommend this. That component makes you feel write and search automatically. showLoading props so good for that. So make request 1 seconds after user stoped the typing with SearchBar component (I recommend this). Or use Input component instead of SearchBar, then add Button and handle press event.

For question 2

I am not sure about only changing font for placeholder. But you can use inputStyle for input's font props.

inputStyle={{ fontWeight: '900', fontFamily: 'Roboto' }}

that will apply to placeholder and value of input.

Upvotes: 1

Related Questions