not able to add LWC cmp on the app page

Question

try to add this lwc cmp on a page but it is showing an error and not adding to the page.

Action.prototype.finishAction Error [Error in $A.getCallback() [p.navigatiommixin is not a function] Callback failed: serviceComponent://flexipage.editor.aura.component.FlexipageComponentController/ACTION$loadComponentDefinitions] new Aura.externalLibraries()@https://vml-dev-ed.lightning.force.com/auraFW/javascript/7FPkrq_-upw5gdD4giTZpg/aura_prod.js:354:407 {anonymous}()@https://vml-dev-ed.lightning.force.com/auraFW/javascript/7FPkrq_-upw5gdD4giTZpg/aura_prod.js:116:1

import { LightningElement, track, wire } from 'lwc';
import getApartment from '@salesforce/apex/appApartmentDetailsClass.getApartment';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { navigatiommixin } from 'lightning/navigation';
import getSearchedProperty from '@salesforce/apex/appApartmentDetailsClass.getSearchedProperty';
import { registerListener, unregisterAllListeners} from 'c/pubSub';
import { CurrentPageReference } from 'lightning/navigation';

export default class ApartmentSearchResult extends navigatiommixin (LightningElement) {
    @track apartments;
    @track apartmentFound;
    @track showContactDetails = false;
    @track apartOwnerid;
    @track bedFilter;
    @track bathroomfilter;
    @track availableFilter;
    @track budgerfilter;

    @wire(getApartment)
    wiredproperties({data,error}){
        if(data){
            this.apartments= data;
            this.apartmentFound=true;
        }
        else if (error){
            this.ShowToast('Error', error.body.message,'error');
            this.apartmentFound=false;
        }
    }
        ShowToast(title,message,variant){
            const event = new ShowToastEvent({
                title: title,
                message: message,
                variant: variant,
            });
            this.dispatchEvent(event);
        }
        showContact(event){
            this.apartOwnerid= event.target.value;
            this.showContactDetails = true;
        }
        closeDetails(){
            this.showContactDetails = false;
        }
        @wire (CurrentPageReference) pageRef;
        connectedCallback(){
            registerListener("handleBedroomChange", this.handleBedroomChange,this);
        }
        disconnectedCallback(){
            unregisterAllListeners(this);
        }
        handleBedroomChange(bedChange){
            this.bedFilter = bedChange;
            getSearchedProperty({
                bedroom: this.bedFilter,
                bathroom: this.bathroomfilter,
                maxbudget: this.budgerfilter,
                available: this.availableFilter

            })
            .then(result=>{
                this.apartments = result;
            })
            .catch(error=>{
                this.ShowToastEvent('ERROR', error.body.message,'error');
            });
        }
    }

Answer 1

"x is not a function" type errors are the result of typos. In this case, you wrote navigatiommixin, which is the typo. You'll need to find and replace that typo with the correct value, most likely NavigationMixin (note that JavaScript is case-sensitive, which may also be a contributing factor).