How to use `.append` method with JSX component in Framework7 core?

Questions
1

According to the documentation, JSX component is supported in framework7 core. I populate the page after fetching the data inside page:init event, then, i append the template with data using .append method. Is it possible to use JSX Component here?

On a side note, is it the correct way to calling a API and populating the data. I think page:init is the right place to use api calls.

2

There is no such in JSX, if you use JSX it should be done in JSX-way:

const items = $ref([]);

$on('pageInit', () => {
  fetch('something').then((res) => res.json()).then((data) => {
    items.value = data;
  })
})

return () => (
  <div class="page">
    {items.length > 0 && (
      <ul>
        {items.map((item) => (
          <li>{item}</li>
        ))}
      </ul>
    )}
  </div>
)