ASP.NET Core 3 and React

Optional and default props

A prop can be optional so that the consumer doesn't necessarily have to pass it into a component. For example, we could have an optional prop in the Question component that allows a consumer to change whether the content of the question is rendered or not. We'll do this now:

1. First, let's import the gray2 color from our global styles into Question.tsx:

import { gray2, gray3 } from './Styles';

2. We need to add the content into the Question component, so add the following code beneath the question title in the JSX:

export const Question: FC<Props> = ({ data }) => (  <div ... >    <div ... >      {data.title}    </div>    <div      css={css`        padding-bottom: 10px;        font-size: 15px;        color: ${gray2};      `}    >      {data.content.length > 50 ? `${data.content.substring(0, ...