• 카테고리

    질문 & 답변
  • 세부 분야

    풀스택

  • 해결 여부

    미해결

제로초님

20.06.26 00:49 작성 조회수 80

0

제로초님 안녕 하세요 

불변성 관련 해서 궁금한게 있어서 질문 남깁니다.

const [ dataInfo, setDataInfo ] = useState(

        {

            labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],

            datasets: [

                {

                label: 'My First dataset',

                fill: false,

                lineTension: 0.1,

                backgroundColor: 'rgba(75,192,192,0.4)',

                borderColor: 'rgba(75,192,192,1)',

                borderCapStyle: 'butt',

                borderDash: [],

                borderDashOffset: 0.0,

                borderJoinStyle: 'miter',

                pointBorderColor: 'rgba(75,192,192,1)',

                pointBackgroundColor: '#fff',

                pointBorderWidth: 1,

                pointHoverRadius: 5,

                pointHoverBackgroundColor: 'rgba(75,192,192,1)',

                pointHoverBorderColor: 'rgba(220,220,220,1)',

                pointHoverBorderWidth: 2,

                pointRadius: 1,

                pointHitRadius: 10,

                data: [65, 59, 80, 81, 56, 55, 40]

                }

            ]

        }

    )

    const Test = useCallback((e) => {

        e.preventDefault()

        

        setDataInfo((prevState) => ({

            ...prevState,

            datasets: [(prev) => {

                fill:true

            }]

            })

            

        )

    }, [])

Test라는 버튼을 클릭 했을 때 

dataInfo state안에 있는 datasets 객체에서 다른 것들은 유지 하고 

예를 들어 fill이나 lable 같은 것만 변경 하고 싶을 때는 어떤식으로 처리를 해줘야 하는지 궁금 하여 질문 납김니다.

답변 1

답변을 작성해보세요.

0

이런 것에도 immer를 적용하시는 것을 추천드립니다. 배열 안 객체를 불변성있게 바꾸는 게 정말 복잡합니다.

setDataInfo((prev) => produce(prev, (draft) => {

  return 변경된상태(불변성 필요x)

});