리액트 ajax 응용문제 2 질문드립니다

<button id="btn"onClick={()=>{
            axios.get('https://codingapple1.github.io/shop/data2.json')
            .then((결과) => {
              let copy = [...shoes, ...결과.data];
              setShoes(copy);
            axios.get('https://codingapple1.github.io/shop/data3.json')
            .then((result)=>{
              if(count == 0){
                let copy = [...shoes, ...결과.data];
              }
              else if(count == 1){
                let copy = [...shoes, ...결과.data, ...result.data];
              setShoes(copy);
              }
              else if(count == 2){
                

                 여기에 버튼을 숨기는 코드만 작성하면 끝납니다. 리액트 방식으로 해결할수 있을거같은데
                 자바스크립트 문법밖에 생각이 안납니다
                 그래서 자바스크립트 문법쓰고 끝내려고 document.getElementById('btn').style.display = 'none';을 썼는데도
                 버튼이 숨겨지질않아서 해결방법이 궁금합니다.. 
                 


              }
              
            })
            })
          }}>더보기</button>