typescript

인터페이스 사용하여 dropdown 만들기

tues 2023. 11. 3. 02:01
(() => {
  interface CityDropdown {
    value: string;
    selected: boolean;
  }

  interface ZipcodeDropdown {
    value: number;
    selected: boolean;
  }
  // <select><option>서울시</option><option selected>인천시</option><option>광주시</option></select>
  function createDropdown(list: CityDropdown[]): string {
    let result = "";
    result += "<select>";
    list.forEach((item) => {
      result += `<option ${item.selected ? "selected" : ""}>${
        item.value
      }</option>`;
    });
    result += "</select>";
    return result;
  }

  var cityList: CityDropdown[] = [
    { value: "서울시", selected: false },
    { value: "인천시", selected: true },
    { value: "광주시", selected: false },
  ];

  const cityTag = createDropdown(cityList);
  console.log(cityTag);
})();

'typescript' 카테고리의 다른 글

클래스 타입 지정에 인터페이스 사용  (0) 2023.11.03