Property 'title' does not exist on type 'IntrinsicAttributes & IProps'

Question

there. I'm trying to make an item not visible in another view, I'm working this out with interfaces.

The problem is that I'm getting the error which is in the title of this question.

Here is part of the code so that you can understand what's going on:

interface IProps {
  isDisplayedLoadingTitle: boolean;
}

export default (props: IProps) => (
  <Fragment>
    {isDisplayedLoadingTitle && (
    <ChartLoaderUI.ChartTitleContainer>
      <ChartLoaderUI.ChartTitle>
        <ChartLoaderUI.Title>{`Loading...`}</ChartLoaderUI.Title>
      </ChartLoaderUI.ChartTitle>
    </ChartLoaderUI.ChartTitleContainer>
    )}

I'm adding the tag <ChartLoader isDisplayedLoadingTitle={true}/> in other files to render it in the views.

How can I fix this, another question: the fact that I can choose it from being true or false will actually hide whats inside the flag ( {isDisplayedLoadingTitle && ( )?

Thanks in advance for the help.

Answer 1

You are not accessing the prop on the actual props object. You'd want to use props.isDisplayedLoadingTitle && . Or you could destructure it from the props object by replacing (props: IProps) with ({ isDisplayedLoadingTitle}: IProps) and leave the code as you have it now.

As far as the issue with the title, I don't see where that prop is even accessed, so it could be an issue with the ChartLoaderUI component. You'd have to post the code where you are trying to access the title prop, or the code for the ChartLoaderUI if that's a component you built.