1 year ago

#68173

test-img

Shubham Sonar

Polling in React-Native using class components

  1. Periodically (every 10seconds) poll for new posts from this API https://hn.algolia.com/api/v1/search_by_date?tags=story&page=0 via a GET request.
  2. New posts fetched after 10 seconds will be added to old posts.
  3. Increase page count in each subsequent request.
  4. Implement pagination when the list is scrolled.
  5. The pagination and periodic request both should work manually exclusive i.e for each request page number will be increased. Requests with the same page number should never be made.
  6. Display the title, URL, created_at, and author of each post in a table.
  7. Upon selecting a row in the table, a model should appear containing the raw JSON data of the post.
  8. Support the ability to filter by created_at and title.
  9. Support the ability to search the table by title, URL, and author name.

What I have Done for that

class MainPostPoll extends Component<any, any> { constructor(props: any) { super(props) this.state = { loading: false, fromFetch: false, fromAxios: false, axiosData: [], } }

goForAxios = () => { this.setState({ loading: true, }) axios .get('https://hn.algolia.com/api/v1/search_by_date?tags=story&page=0') .then((response) => { console.log('getting data from axios', response.data)

    this.setState({
      loading: false,
      axiosData: response.data.hits,
    })
  })
  .catch((error) => {
    console.log(error)
  })

}

renderItem = (item: any) => { return ( {item.item.title} {item.item.url} {item.item.created_at} {item.item.author} ) }

render() { return (

  <View>
    <View style={{ margin: 18 }}>
      <TouchableOpacity style={{}} onPress={this.goForAxios}>
        <Text>PostPoll</Text>
      </TouchableOpacity>
    </View>
   
    <FlatList
      data={this.state.axiosData}
      renderItem={(item) => this.renderItem(item)}
      keyExtractor={(item) => item.id}
    />
  </View>
)

} }

javascript

arrays

reactjs

react-native

polling

0 Answers

Your Answer

Accepted video resources