[react] Select-react / wanning 문구 처리

 

Warning: Prop `id` did not match. Server: "react-select-46-live-region" Client: "react-select-3-live-region"

react-select를 사용중인데 위와같은 에러가 난다면 

 

 <Select instanceId="uniqueValue" options={guData?.returnList} />

 

select tag에 instanceId를 유니크하게 설정해주면 경고문구가 사라진다. 

 

혹은 아래와 같이 useId를 이용해도 된다. 

import React, { useId } from 'react';
import Select from 'react-select';

export default function StableSelect({ ...props }) {
  return <Select {...props} instanceId={useId()} />;
}