본문 바로가기
카테고리 없음

SurveyJs 최신화시 나타나는 에러 : Property 'questionHashes' is private and only accessible within class 'SurveyModel'

by 안뇽! 2023. 2. 3.
반응형

요약

questionHashes가 private로 변경된 대신, getAllQuestions 라는 메소드가 생긴 것 같아요. 그래서 요것을 이용하면 기존에 Object.entries를 이용해서 배열로 변환해주는 작업 없이 바로 QuestionModel 배열을 받을 수 있어보여요.

 

발단

우리회사 부트캠프 지원자들은 SurveyJS로 만들어진 form을 통해 지원서를 작성한다.

 

얼마전 react를 18로 업그레이드 했는데, surveyJS에서 에러가 났다.

surveyJS도 업글을 하니 전에 보이지 않던 에러가 났다.

(버전은 survey-creator-react : 1.9.71, survey-react-ui : 1.9.71 이다)

 

node_modules를 바꿀수도 없고,, (심지어 node_modules로 들어가서 questionHashes를 public으로 바꾸면 다른곳에서 에러가 났다.)

 

해결

 

이리저리 고민하다가 해당 페이지를 만드시고 별명이 surveyJS 1타 강사인 JK.SONG(가칭)님에게 도움을 요청했다. 그분이 surveyJS 공식홈페이지를 뒤져서 다른 메소드를 찾아 오셨다.

 

questionHashes가 private로 변경된 대신, getAllQuestions 라는 메소드가 생긴 것 같아요. 그래서 요것을 이용하면 기존에 Object.entries를 이용해서 배열로 변환해주는 작업 없이 바로 QuestionModel 배열을 받을 수 있어보여요.

이전에는 questionHashes를 통해 받아온 가공되지 않은 데이터들을 Object.entries로 가공하여 QuestionModel을 얻어왔었는데,

getAllQuestions를 통해 한번에 QuestionModel 배열을 받아올 수 있게 되었다.

 

더 편리해진건 아니고, 그냥 이제 questionHashes대신 getAllQuestions()를 사용해야한다.

// before

    const questions = creator.surveyValue.questionHashes.name;

    const convertedQuestionEntries = Object.entries<Question[]>(questions)
      .filter(([, v]) => !blockedQuestionType.includes(v[0].getType()))
      .map(([k, v]) => {
        const type = v[0].getType();
        let choices;
        let inputType;

        if (selectQuestionType.includes(type)) {
          const question = v[0] as QuestionSelectBase;
          choices = question.choices.map((choice: ItemValue) => choice.value);
        }
        if (type === textQuestionType) {
          const question = v[0] as QuestionTextModel;
          inputType = question.inputType;
        }

        return [k, { label: v[0].title, type, choices, inputType }];
        
// after

    const questions = creator.surveyValue
      .getAllQuestions()
      .filter((question) => !blockedQuestionType.includes(question.getType()));

    const convertedQuestionEntries = questions.map((question) => {
      const type = question.getType();
      let choices;
      let inputType;
      if (selectQuestionType.includes(type)) {
        choices = question.choices.map((choice: ItemValue) => choice.value);
      }
      if (type === textQuestionType) {
        inputType = question.inputType;
      }
      return [
        question.name,
        {
          label: question.title,
          type,
          choices,
          inputType,
        },
      ];
    });

 

 

호오옥시 라도 같은 이슈를 겪는 사람이 있다면 이 글을 볼 수 있길..

 

반응형