[BUG] 'BottomNavigation' already registered

[sifex]

Which platform(s) does your issue occur on?

• [X] iOS
• [X] Android

What type of device?

• [X] Emulator
• [X] Device

Please, provide the following version numbers that your issue occurs with:

• Nativescript Versions > 6.X.X
• Nativescript-Vue (Any versions)

Please, tell us how to recreate the issue in as much detail as possible. Describe the steps to reproduce the behavior:

1. Start any project using Nativescript Version 6 and above
2. Observe that they're using the same registerElement name as "BottomNavigation".
3. Error out with Error "Component has already been registered"

Reference:

• https://github.com/NativeScript/NativeScript/issues/6967
• https://docs.nativescript.org/angular/ui/ng-ui-widgets/bottom-navigation

[henrychavez]

Hi @sifex,

yes, a major release is coming to change the component name to BottomNavigationBar to avoid conflicts with the implementation made by the {N} team.

I'm working on that right now, hopefully, will be released tomorrow.

A quick fix will be, don't import the NativescriptBottomNavigationModule and put this code in your app.module.ts

import { registerElement } from 'nativescript-angular/element-registry';
import { BottomNavigation, BottomNavigationTab } from 'nativescript-bottom-navigation';

registerElement('BottomNavigationBar', () => BottomNavigation);
registerElement('BottomNavigationTab', () => BottomNavigationTab);

[sifex]

❤️ Yea got that sorted, just wanted to give you a heads up :smile:

[ugommirikwe]

@henrychavez So, how is this going to wrok with VueJS?

[Lavhe]

@ugommirikwe for VueJs i used

import { BottomNavigation, BottomNavigationTab } from 'nativescript-bottom-navigation';

Vue.registerElement('BottomNavigationBar', () => BottomNavigation);
Vue.registerElement('BottomNavigationTab', () => BottomNavigationTab);

on my main.ts file

just dont forget to use BottomNavigationBar in your code instead of BottomNavigation

[ugommirikwe]

Thanks. 👍🏾