нижняя навигация не работает в SvelteNative

Question

У меня есть простой App.svelte, который показывает мою проблему

      <script lang='ts'>
</script>

<frame>
  <page>
    <actionBar title="Hello" />

    <bottomNavigation>
    </bottomNavigation>
  </page>
</frame>

когда я запускаю это, я получаю белый экран без ничего, но если я удаляю нижнюю навигацию, все работает нормально. Я не понимаю, как заставить работать нижнюю навигацию.

Answer 1

Как отладить это

1. Удалите содержимое bottomNavigation и замените его просто текстом, например, «hello». Это исправит? Если это так, проблема заключается в вашем текущем определении bottomNavigation.

2. Если это не исправит, что, если вы поместите несколько элементов div выше или ниже панели действий с текстом внутри? Если да, то проблема в неспособности bottomNavigation справиться с отсутствием другого текста?

3. Как только вы разместите текст на странице, вы сможете найти его, даже если он кажется очень маленьким или белым и т. д.

4. Наконец, есть почтенная хитрость установки такого стиля:

            <bottomNavigation style="border: 1px solid red;">
      <tabStrip>
        <tabStripItem>
          <label text='My tickets' />
        </tabStripItem>
        <tabStripItem>
          <label text='Buy tickets' />
        </tabStripItem>
        <tabStripItem>
          <label text='Menu' />
        </tabStripItem>
      </tabStrip>
      <tabContentItem>
        <label text='My tickets' />
      </tabContentItem>
      <tabContentItem>
        <label text='Buy tickets' />
      </tabContentItem>
      <tabContentItem>
        <label text='Menu' />
      </tabContentItem>
    </bottomNavigation>
   

Это даст красную рамку этому элементу. Вы можете использовать разные цвета, чтобы придать разным элементам различимые границы, и понять, что получилось.

Сообщите о любых проблемах, в идеале с исполняемым примером, который работает со значком «<>». Это максимизирует шансы на решение.