オブジェクト リテラルは既知のプロパティのみ指定できます。'props' は型 'Properties' に存在しませんが発生するときの解決法
エラーが発生しているファイル
ColfulMessage.tsx
type Props = {
color: string;
message: string;
}
export const ColorfulMessage = (props:Props) => {
return(
<>
<p style={{props.color }}>{props.message}</p>
<p style={{ props.color }}>{props.message}</p>
</>
)
}
解決策
オブジェクトリテラルでpropsの値にアクセスをするときにプロパティを指定する。
※オブジェクトリテラルの表し方{}で囲む
ColorfulMessage.tsx
type Props = {
color: string;
message: string;
}
export const ColorfulMessage = (props:Props) => {
return(
<>
<p style={{color:props.color }}>{props.message}</p>
<p style={{color: props.color }}>{props.message}</p>
</>
)
}
補足
style={{color:props.color }}の一番外側の{}はJavascriptですということを示している。
内側にある{}はオブジェクトであることを示している。