React 기준 변수에 따라 레이블 변경하는 방법

import React, { Component } from 'react';

type MonitoringType = 'T' | 'S';

interface Props {
  monitoringType: MonitoringType;
}

class MonitoringLabel extends Component<Props> {
  getLabel = (): string => {
    return this.props.monitoringType === 'T' ? 'Activity Name' : 'Monitoring Name';
  };

  render() {
    return (
      <div>
        <label>{this.getLabel()}</label>
      </div>
    );
  }
}

export default MonitoringLabel;

 

 

import React, { Component } from 'react';

type MonitoringType = 'T' | 'S';

interface Props {
  monitoringType: MonitoringType;
}

class MonitoringLabel extends Component<Props> {
  getLabel = (): string => {
    const { monitoringType } = this.props;

    switch (monitoringType) {
      case 'T':
        return 'Activity Name';
      case 'S':
        return 'Monitoring Name';
      default:
        return 'Unknown';
    }
  };

  render() {
    return (
      <div>
        <label>{this.getLabel()}</label>
      </div>
    );
  }
}

export default MonitoringLabel;