소개일상공책
Files
Files
        • 29.mdx22.mdx21.mdx20.mdx18.mdx16.mdx14.mdx12.mdx11.mdx

0814

2024. 8. 14.
{
	"type": "dropdown",
	"selectedValue": "MARITIME",
	"values": [
		"MARITIME",
		"AVIATION",
		"RAILWAY"
	],
	"key": "TRANSPORTATION_MODE"
},
{
	"type": "dropdown",
	"selectedValue": {
		"id": 125,
		"text": "test client"
	},
	"key": "CLIENT",
	"searchType": null
},
{
	"type": "dropdown",
	"selectedValue": {
		"id": 3,
		"text": "여행자통관과"
	},
	"key": "CUSTOMS_DEPARTMENT",
	"searchType": [
		{
			"key": "CUSTOMS"
		}
	]
},

위쪽이 기존 라이브러리 인터페이스, 아래쪽이 BOMP 커스텀 인터페이스. values가 null이면 debounce 검색 후 select, 배열이 있으면 dropdown select.

  1. selectedValue가 string인데 보내주는 인터페이스는 객체일 수 있다
  • 서버 데이터를 라이브러리에 맞게 필터링해줘야하나? 아니면 라이브러리를 서버 데이터에 맞게 고쳐야하나?
  • 이건 라이브러리가 아니라 클라이언트에서 처리하는게 맞다.
    • 왜냐하면 변경 가능성이 매우 높기 때문에 엉덩이가 무거운 라이브러리 단계에서 대응하기엔 부적합하다
  1. values가 없는 경우에 어떻게 대응?
  • 기존 라이브러리 인터페이스는 values: {label: string, value: string, isDisabled?: boolean}[]으로 필수값이다
  • values가 없을 때 -> placeholder noData를 보여주고, inputValue에 debounce걸어서 검색 API(/orders/bomp/search/${KEY}?...) 호출 후 데이터 받아 values에 넣어주기.
  • 기존의 DropdownCellTemplate, DropdownCell 타입을 오버라이드하자
왼쪽 화살표08160812오른쪽 화살표