NavigationMixin is embedding js code in url - Error

Question

On a custom tab I have a LWC component that wants to use NavigationMixin to reference another custom tab. In my Controller I have defined that call like this:

import { NavigationMixin } from 'lightning/navigation';

export default class componentName extends NavigationMixin(LightningElement){
    clickReturn(evt) {
        this[NavigationMixin.Navigate]({
            type: 'standard__navItemPage',
            attributes: {
                apiName: 'Name_of_tab'
            }
        });
    }
}

And instead of redirecting me to the custom tab, it embedes the js code on the url leaving it like this:

mysandbox.lightning.force.com/lightning/cmp/clickReturn(e)%7Bthis%5Bu.NavigationMixin.Navigate%5D(%7Btype%3A"standard__navItemPage"%2Cattributes%3A%7BapiName%3A"Configuracion_de_descuentos"%7D%7D)%7D

Answer 1

You have to put apiname

Here is the code i used for my requirement and it works properly

Here is the link for your reference

import { LightningElement, api} from 'lwc';
import { NavigationMixin } from 'lightning-navigation';


export default class Navtab extends NavigationMixin(LightningElement) {
    @api tabName;
    @api label;
    navigateNext() {
        this[NavigationMixin.Navigate]({
            type: 'standard__navItemPage',
            attributes: {
                apiName: this.tabName,
            }
        });
    }

}

Here tab name is your custom tab name .