Default property value in React component using TypeScript

Question

I can\'t figure out how to set default property values for my components using Typescript.

This is the source code:

class PageState
{
}

export class         


        

Answer 1

Functional Component

Actually, for functional component the best practice is like below, I create a sample Spinner component:

import React from 'react';
import { ActivityIndicator } from 'react-native';
import { colors } from 'helpers/theme';
import type { FC } from 'types';

interface SpinnerProps {
  color?: string;
  size?: 'small' | 'large' | 1 | 0;
  animating?: boolean;
  hidesWhenStopped?: boolean;
}

const Spinner: FC = ({
  color,
  size,
  animating,
  hidesWhenStopped,
}) => (
  
);

Spinner.defaultProps = {
  animating: true,
  color: colors.primary,
  hidesWhenStopped: true,
  size: 'small',
};

export default Spinner;