[React] 'react-simple-jstree' 에서 클릭한 파일 Path 가져오기

리액트에서 폴더 트리를 사용하는데 클릭한 파일경로를 얻는 방법을 시행착오(?) 끝에

 

허무할 정도로 간단하게 얻는 방법을 알게되어 포스팅합니다.

 

분명 저처럼 메서드 만들어서 알아내려고하는 분이 분명있을거 같....

 

먼저 tsx파일의 return 부분입니다.

 

const handleNodeSelect = (e: Event, data: any) => {
    if (data && data.node && data.instance) {

      // 클라이언트에서 선택한 폴더의 경로
      const folderPath = data.instance.get_path(data.node, '/');

      console.log(folderPath);

      // API에서 선택된 폴더의 이미지 리스트를 가져오기
      axios.get('/api...', {
        params: {
          folderPath: folderPath,
        },
      })
        .then(response => {
          console.log(response);
        });
    }
  };

return(
....
<TreeView treeData={treeData} onChange={handleNodeSelect} />
...)

 

 

 

....클릭했을때 데이터보고 함수짜고 했는데....

 

instance.get_path(data.node, '/')로 간단하게 해결했습니다.

 

클릭!

 

 

console.log