props정보를 컴포넌트의컴포넌트로 넘기는 법이궁금합니다

아하 감사합니다 제가 하나 오해를하고있었습니다 ㅋㅋㅋ props로 전달할때

컴포넌트 태그에 이름={이름} 남겨야하는곳에서 데이터바인딩을할때 실수가있었습니다

그래서 지금은 다시 바인딩하고 코드를 수정하고있습니다

근데 useState의 두번째 파라미터인 수정할때 사용하는 파라미터관련해서 컴포넌트를 나눠놓고 프롭스로 데이터를 전송해준 js파일에서 계속 빨간줄이나오면서 not defined가 나오고있습니다

[state , stateModify] = useState(0);

이렇게 지정해놓은걸 컴포넌트에 props로 전송하고

전송된 js파일에서 axios.get().then((result) ={stateModify(props.test + 1)}) 을 하려고하면 

stateModify 에 빨간줄이쳐지면서 not defined 가 나옵니다 혹시나해서 props.stateModify라고해주면 오류는 사라지지만 웹페이지에서 제대로 코드가 움직이질않아서 catch만 실행되고있습니다 ㄷㄷ... props로 데이터를 전송한 컴포넌트 내에서 axios get result사용중에 useState의 두번째 파라미터 함수를 사용하려면 어떻게해야할까요 

그말씀은 즉 컴포넌트로 만들어낸 태그에<component exState={exState} exStateModify={exStateModify} /> 이런식으로 같이써주어주면 내부에서 같이 사용할수있다는 뜻일까용 

감사합니다 적용되어 문제를 하나하나 풀어가고있습니다

그런데 또하나의 오류가 발생한것같습니다

리액트에서의 Ajax 요청방법 2 & 숙제풀이 파트에서

더보기버튼을 클릭하면 json파일의 데이터를  aixos를 이용해 가져오는방식을 컴포넌트화 시키고있었습니다

컴포넌트화 하기 전 강의대로 똑같이할때는

더보기버튼을 1번클릭하면 기존데이터 0 1 2 의 데이터와 result.data 의 3 4 5를합쳐서 가져왔고 012 345 가 같이 출력이되었습니다

더보기버튼을 한번더 클릭하면 012 345 가 딥카피로 담긴 데이터와 카운트로 변형시켜 다른 json파일을 가져오게끔하여 다음데이터의 result.data 를 한번더 가져와서

012  345 678 의 데이터를 잘 가져오는것에 성공하였습니다

그런데 컴포넌트화 시키고난뒤 props를 이용하여 데이터를 가져올때는 상황이 달랐습니다

처음 클릭시엔012 345 로 잘 가져오다가 두번째 클릭할때는 345 가 생략되고 012 678 이 가져와지는것이었습니다

아무래도 props로 딥카피된것을 가져오는 과정에서 무언가 잘못된것인지 012 345 로 한번 출력된 데이터를 다시 딥카피하지않고 기존의 012 만 둔상태로 데이터가 를 가져오는것같았습니다

 어떻게 해결하면 좋을지 고민후에 props가 문제인것같아 테스트를 해보아도 잘안된것같습니다 어떻게하면 좋을까요 

import React, {useEffect, useState}from 'react';
import axios from'axios';

function MoreItem(props){
  // props가 문제인것같으니 테스트
  let testt = [...props.productData] 
  return(
   <>
    <button className="btn btn-primary" onClick={ ()=>{
 
  
  // axios.get('https://codingapple1.github.io/shop/data2.json')
  // axios.get(ProductDataJson)
  // axios.get('https://gist.githubusercontent.com/sushi-ninja/5cfb85703ca7b6726e645b7a5150f9fb/raw/8ba2b4c97b8e51f6dff06b26611e0c42afeb12ac/productdata2.json')'
  
  // 세밀하게 하나하나 가져오는 함수 
  // axios.get('http://localhost:3001/productdata2/6')

  // data 세트 별로 가져오는 함수
  axios.get('http://localhost:3001/productdata'+ props.productNum)
    //서버에 ajax요청이 성공했을때 then()함수가 실행이된다.
    .then((result)=>{
      console.log(testt);
      // delete loading ui
  
      
      
      props.productNum < 1 ? props.productNumModify(props.productNum + 1) : props.productNumModify(props.productNum + 0);
      
      console.log(result.data);
      // productData 와 result.data 이 두개를 동시에 딥카피하여 2개의 array 자료를 만들어냄
      // [{},{},{}, {},{},{}] 이렇게하면 기존의 data와 새로 가져온 data 두개가 합쳐진 결과값이 완성됨
      // productDataModify( [...productData, ...result.data] );

      // 데이터별로 하나하나 가져올때 사용하는 함수
      // productDataModify( [...productData, result.data] );

      // 데이터를 세트로 가져올때 사용하는 함수 
      props.productDataModify( [...props.productData, ...result.data] );
      console.log(...props.productData);
      console.log(...result.data);
      
    
    })
    // 반대로 요청에 실패했을땐 catch()함수가 실행이된다.
    .catch(function (error) {
      if (error.response) {
        // 요청이 이루어졌으며 서버가 2xx의 범위를 벗어나는 상태 코드로 응답했습니다.
        console.log(error.response.data);
        console.log(error.response.status);
        console.log(error.response.headers);
      }
      else if (error.request) {
        // 요청이 이루어 졌으나 응답을 받지 못했습니다.
        // error.request는 브라우저의 XMLHttpRequest 인스턴스 또는
        // Node.js의 http.ClientRequest 인스턴스입니다.
        console.log(error.request);
      }
      else {
        // 오류를 발생시킨 요청을 설정하는 중에 문제가 발생했습니다.
        console.log('Error', error.message);
      }
      console.log(error.config);
    });
  }}>
  더보기
</button>

   </>
  );
}

export default MoreItem;

위가 해당 컴포넌트의 전문입니다. 

그리고 추가로 삼항연산자를 사용하는 부분에서 :뒤에 아무것도 쓰고싶지않아  NULL을 사용하면  NULL을 찾을수없다고 오류가나오는데 이부분은 어떻게 공부하면될까요?

null 같은경우는 html외에 json데이터를 가져오는 카운트에서 사용하고픈데 : 이후 null대신쓸만한게있을까용