Fetch data from DB using Stencil Js Component

Do the following to fetch data from an API

  1. Need a placeholder API or a live API
  2. Create a component
import { Component, Prop, State } from '@stencil/core';

    tag: 'load-more-component',
    styleUrl: 'load-more-component.css'
export class LoadMoreComponent {

    // Indicate that name should be a public property on the component
    @Prop() total: string;

    @State() content :Array<any>;

    @State() URL:any;
    componentWillLoad() {
        this.URL = 'https://jsonplaceholder.typicode.com/posts/' + this.total;
        return fetch(this.URL)
            .then(response => response.json())
            .then(data => {
                this.content = data;

    render() {
        return (
                Total item {this.total}


  <load-more-component total="10"></load-more-component>