What is the Best Practice for Making a Customized TabBar in Goji.js? about goji-js HOT 2 CLOSED

Hi @Ziyu-Chen

I almost understand your questions. I think there are 2 separate issues.

1. When and how does GojiJS support custom-tab-bar ?

2. How to implement the same feature in current GojiJS framework.

At first, GojiJS doesn't custom-tab-bar for now. There are several problems to be decided before we move it into next steps.

1. This feature is not a common solution that only WeChat and QQ support. Supporting this feature might reduced the cross-platform capabilities.

2. How to support getTabBar API.

And then, I think you can try these ways to implement the same feature which support not only WeChat/QQ but also other platforms.

1. Use position: fixed to render custom tab bar on each pages and use wx.redirectTo to switch between them.

// pages/a.tsx

render(
  <>
    <PageA />
    <CustomTabBar />
  </>
);

2. Treat all tab bar pages rather than the whole Mini Program as a single page application. Switching between tabs actually is internal state changes.

// pages/index.tsx

render(
  <>
    {selected === 'a' && <PageA />}
    {selected === 'b' && <PageB />}
    ...
    <CustomTabBar />
  </>
);

from goji-js.

@malash Thank you for your answer! I'll give it a shot.

from goji-js.