ajax 숙제 질문

[김은영]

1. 첫번째 질문

 

저는 다른 하나의 컴포넌트를 생성해서 (Detail2) 

  props.shoes.map((글, i) => {
            return (
              <Detail shoes={글} i={i} key={i} />

            )

          })

이렇게 만든 후 <Detail2 shoes={shoes}/>를 App 컴포넌트에 넣어서 사용했는데 

 

Detail2에 버튼을 만들고  props.shoes변경([...props.shoes, ...result.data]); 할 경우 실패로 뜹니다.

 

button의 위치가 꼭 App 컴포넌트에 들어가야 shoes변경([...shoes, ...result.data]); 이 코드가 성공하는 건가요?

 

별개의 컴포넌트에서도 사용가능한건가요?

 

2. 두번째 질문

 <button className="btn btn-primary" onClick={() => {

            axios.get('https://codingapple1.github.io/shop/data2.json')
              .then((result) => {
                console.log('성공했어요');

                var shoesAdd = [...shoes];

                shoesAdd.push(...result.data);
                console.log(shoesAdd);
                shoes변경(shoseAdd);
              
              
              })
              .catch(() => {
                console.log('실패했어요')

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

 

이렇게 코드를 짤 경우 비효율적인건가요??

이 코드 또한 다른 컴포넌트에서 props할 경우 실패합니다 ㅠㅠ

[codingapple]

1. 컴포넌트 만들든 말든 상관없이 props로 잘 전해주기만 하면 state와 state변경함수를 어떤 곳에서나 사용가능합니다 

무슨 에러가나는지는 몰라서 말씀은 못드리지만 아마 props로 잘못 전해준게 아닐까요 

2. 저 버튼이 하위컴포넌트에 있다면 

shoes, shoes변경 이런 자료들을 props로 잘 전해주면 사용가능합니다 

[김은영]

shoes변경={shoes변경}을 안넘겨줘서 그런거였어요 잘작동합니다 감사합니다!!

[글쓴이]

글