• 로그인
  • 장바구니에 상품이 없습니다.

home2 게시판 React 게시판 질문

질문

10 글 보임 - 1 에서 10 까지 (총 10 중에서)
  • 글쓴이
  • #98767

    쿄쿄
    참가자
    제가 리엑트로 프로젝트 하나 만들고 있습니다  일종의 심리테스트
    
    Main.js에서 radio 이용해서 버튼 누르고
    score 합산해서 그 결과를 Result.js에서 보여주려고 해요
    
    하지만 보시다시피 case마다 점수가 다를 뿐만 아니라,,
    data.js에 심리테스트 문항들이 있는데, 4,5,7,8번 문항은 else 구문안으로 들어가서 점수가 달라져요
    
    이럴때 Result에 뭐라고 코드를 구현해야 할까요?
    
    Result.js 일부 -----------------
    
    function Result( {values}) {
      // 결과를 계산할 때 사용할 상태 변수
      const totalScore = 0;
      // 사용자의 답변을 기반으로 결과를 계산하는 함수
      const calculateScore = (questionId, value) => {
        const spec = [4, 5, 7, 8];
        let score;
        if (spec.includes(questionId)) {
          switch (value) {
            case '전혀':
              score = 3;
              break;
            case '가끔':
              score = 2;
              break;
            case '자주':
              score = 1;
              break;
            case '항상':
              score = 0;
              break;
            // default:
            //   score = 0;
          }
        } else {
          switch (value) {
            case '전혀':
              score = 0;
              break;
            case '가끔':
              score = 1;
              break;
            case '자주':
              score = 2;
              break;
            case '항상':
              score = 3;
              break;
            // default:
            //   score = 0;
          }
        }
        totalScore += score;
       
      };
    
    긴글 읽어주셔서 감사합니다.
    #98804

    codingapple
    키 마스터
    이제 원할때 calculateScore실행하면 잘될거같은데요 totalScore 는 변수말고 state로 만듭시다
    #98840

    쿄쿄
    참가자
    근데도 안되서요..
     
    import React, { useState } from 'react';
    function Result (questionId, value)  {
      // 결과를 계산할 때 사용할 상태 변수
      let [score, totalScore] = useState(0);
      
        const spec = [4, 5, 7, 8];
        //let score;
        if (spec.includes(questionId)) {
          switch (value) {
            case '전혀':
              score = 3;
              break;
            case '가끔':
              score = 2;
              break;
            case '자주':
              score = 1;
              break;
            case '항상':
              score = 0;
              break;
            default:
              score = 0;
          }
        } else {
          switch (value) {
            case '전혀':
              score = 0;
              break;
            case '가끔':
              score = 1;
              break;
            case '자주':
              score = 2;
              break;
            case '항상':
              score = 3;
              break;
            default:
              score = 0;
          }
        }
        
        totalScore += score;
      
     
      return (
        <div>
          <h1>결과</h1>
          <div> 총 점수 : {totalScore}</div>
        </div>
      );
      
      }
    export default Result;
     
    #98867

    codingapple
    키 마스터
    Result는 컴포넌트로 쓸지 점수계산용 함수로 쓸지 택1만 합시다 
    유저가 선택한 답변들 저장할 array state 만들어두고
    array state에 있던 자료들마다 switch문 적용하면 총점 나올듯요 
    
    #98886

    쿄쿄
    참가자
    gpt한테 물어봐도 감이 너무 안잡혀요... 조금만 알려주세요......ㅠㅠㅠ
    #98930

    codingapple
    키 마스터
    맨위에 values에 유저가선택한값들 array자료로 들어오는거면
    values 반복문돌려가면서 하나씩 calculateScore() 적용하면 끝날거같은데요  
    감잡아서 코딩하면 안되고 어떤 식으로 동작할지 정확히 적어둡시다 
    
    #98966

    쿄쿄
    참가자
    유저가 선택한 값들이 객체라서
    // Main.js 일부분
    let change = (questionId, value) => {
        setAnswer({
          ...answer,
          [questionId]: value
        });
        
        let arr = [ questionId,value];
        console.log(arr);
      };
    을 이렇게 했습니다.
    그리고 위에 같이 result.js를 했는데
     function () { [native code] }0 라고 뜹니다...ㅠㅠㅠ
    
    
    
    #98986

    codingapple
    키 마스터
    함수 실행이아니라 이름만 출력하면 그런게 뜹니다
    #99026

    쿄쿄
    참가자
    캡처
    배열형태로 만들었는데,
    main에서 result로 넘어가면 undefined라고 뜹니다..
    분명 넘어가게 했는데...
    
    function result () {
     console.log(Main.arr);
    
    살려주세요ㅠ.ㅠ
    #99057

    codingapple
    키 마스터
    새로고침되면 state 리셋되어서 그럴수도요 이동은 navigate()로 합시다
10 글 보임 - 1 에서 10 까지 (총 10 중에서)
  • 답변은 로그인 후 가능합니다.

About

현재 월 700명 신규수강중입니다.

  (09:00~20:00) 빠른 상담은 카톡 플러스친구 코딩애플 (링크)
  admin@codingapple.com
  이용약관, 개인정보처리방침
ⓒ Codingapple, 강의 예제, 영상 복제 금지
top

© Codingapple, All rights reserved. 슈퍼로켓 에듀케이션 / 서울특별시 강동구 고덕로 19길 30 / 사업자등록번호 : 212-26-14752 온라인 교육학원업 / 통신판매업신고번호 : 제 2017-서울강동-0002 호 / 개인정보관리자 : 박종흠