안녕하세요. 선생님.
react 강의 완강하고, axios api를 사용하여 데이터를 처리하고 있습니다.
const response = await axios.post(
"url주소",
{
Para: [{ Similarity: 0.4 }],
query: {
부산: ["부산"],
공원: ["공원", "유원지"],
},
}
);
위의 코드는 query 부분을 직접 입력한 코드이고,
query : { } 부분이 state를 사용하여 동적으로 바뀌도록 하고싶습니다.
검색창에 검색어를 입력하면 관련 키워드가 자동 생성되는 api가 있습니다.
response는 state에 담아서 필요한곳에 값을 뿌려줍니다.
예를들어 "부산 공원"이라고 검색하면
{
"placesKor": [
"부산"
],
"query": {
"공원": [
"공원",
"식물원",
"수목원",
"유원지",
"근린",
"골프장",
"박물관",
"국립공원",
"전시관",
"축구장",
"동물원"
],
"부산": [
"부산"
]
}
}
이러한 데이터가 생성되고 이 데이터를 사용하여 체크박스 기능을 만들어서 state에 담는 기능까지 구현했습니다. 해당 데이터를 선택하면, ["부산", "동물원", "근린"] 이런식으로 배열로 저장이 됩니다. 체크박스 선택/해제에 따라서 state 배열에 데이터가 추가되고 제거가 유동적으로 됩니다. 근데 이렇게 하나의 배열이 아니라,
query: {
부산: ["부산"],
공원: ["공원", "유원지"],
},
이런식으로 키값과 배열이 체크박스 선택/해제 여부에 따라서 유동적으로 추가되고 제거가 되어야 합니다.
위의 연관키워드 데이터를 활용하여 query : { } 부분에 체크박스 state값을 넣으려고 할 때, 검색어에 따라서 "부산 공원","부산 울산 공원" 등 동적으로 변하는 데이터를 어떻게 처리해야 하는지 모르겠습니다. "부산 공원"이 키워드로 올 때는
query: {
부산: ["부산"],
공원: ["공원", "유원지"],
},
"부산 울산 공원"이 키워드로 올 때는
query: {
부산: ["부산"],
울산: ["울산"],
공원: ["공원", "유원지", "식물원"],
},
이런식으로 api에서 어떤 데이터를 체크박스로 선택하느냐에 따라서 동적으로 키값과 배열이 생성이 되어야하는데,
{ }중괄호 안에 map을 사용하여 처리해보려고도 했으나 안되더군요...
axios post 내에서 처리가 까다롭네요..
방법을 알려주시면 정말 감사하겠습니다ㅠ
