Property does not exist on interface in React Typescript

Question

I am pretty new to React but with some Angular attempts before.

I was actually trying to implement a component which accepts a data model or object as parameter

Looks like this

import react from 'react'

interface SmbListItem{
    index:number;
    primary:string;
    secondary:string;
}
   

export default function SmbList({props}:SmbListItem){
    return(
        <>

        </>
    );
}

But its saying props does not exists on SmbListItem

What I did wrong?

Also requesting a suggestion on interface or types are the best option in this situation

Answer 1

import react from 'react'

interface SmbListItem{
    index:number;
    primary:string;
    secondary:string;
}
   

export default function SmbList({index, primary, secondary}:SmbListItem){
    return(
        <>

        </>
    );
}

There is no such props defined in your Interface Props

Even if you are not using Tsand you are sure about the props you would destructure your props like this

export default function SmbList({index, primary, secondary}){
    return(
        <></>
    );
}

For Your Second Question Have a look into Types vs Interface