fix: 编辑赋值

src/modules/teach-tool/components/NewQuestionTab.jsx

 /*
  * @Author: yuananting
  * @Date: 2021-02-25 14:34:29
- * @LastEditors: yuananting
- * @LastEditTime: 2021-03-18 09:33:34
+ * @LastEditors: sunbingqing
+ * @LastEditTime: 2021-03-18 14:49:27
  * @Description: 助学工具-题库-题目管理-新建题目Tab
  * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
@@ -99,6 +99,12 @@ class NewQuestionTab extends Component {
   shouldComponentUpdate(nextProps, nextState) {
     const { questionInfo } = nextProps;
     if (this.props.questionInfo !== questionInfo) {
+      if (questionInfo.gapFillingAnswerList !== this.state.gapFillingAnswer) {
+        console.log(999, questionInfo.gapFillingAnswerList)
+        this.setState({
+          gapFillingAnswer: questionInfo.gapFillingAnswerList
+        })
+      }
       this.setState(
         {
           stemContent: JSON.parse(
@@ -106,12 +112,13 @@ class NewQuestionTab extends Component {
           ),
         },
         () => {
-          const editorHtml = this.transferStemDocument(
-            questionInfo.questionStemList[0].content
-          );
-          const _blanksList = editorHtml.getElementsByClassName("fill-line");
-          // this.setState({blanksList:_blanksList})
-          console.log("转:", editorHtml.getElementsByClassName("fill-line"));
+          const con = questionInfo.questionStemList[0].content;
+          const input = con.match(/<input([^<>]*)>/g)
+          const _blanksList = input.map(item => {
+            return this.transferStemDocument(item).firstChild
+          })
+          console.log("-----", _blanksList)
+          this.setState({blanksList:_blanksList})
         }
       ); // 题干内容
       this.setState({
@@ -197,7 +204,7 @@ class NewQuestionTab extends Component {
     const { chooseOptions } = this.state;
     if (this.props.questionTypeKey === "GAP_FILLING") {
       this.state.blanksList.forEach((item, index) => {
-        if (item.answerTagList.length === 0) {
+        if (item.correctAnswerList.length === 0) {
           this.setState({ [`optionsValidate_${index}`]: "error" });
           this.setState({ [`optionsText_${index}`]: "请输入答案" });
           validateError++;
@@ -525,9 +532,9 @@ class NewQuestionTab extends Component {
 
   changeBlankCount = (data) => {
     console.log("data:", data);
-    data.forEach((item) => {
-      if (!item.answerTagList) {
-        item.answerTagList = [];
+    data && data.length > 0 && data.forEach((item) => {
+      if (!item.correctAnswerList) {
+        item.correctAnswerList = [];
       }
       item.inputVisible = false;
       item.errorHold = false;
@@ -536,7 +543,7 @@ class NewQuestionTab extends Component {
     });
     this.setState({ blanksList: data });
   };
-
+    
   addAnswerTag = (optionItem) => {
     const _blanksList = this.state.blanksList;
     _blanksList.forEach((item) => {
@@ -549,19 +556,26 @@ class NewQuestionTab extends Component {
 
   handleInputConfirm = (optionItem, val) => {
     const _blanksList = this.state.blanksList;
-    var gapFillingAnswer = [];
-    _blanksList.forEach((item) => {
+    // const { gapFillingAnswer } = this.state;
+    let _gapFillingAnswer = [];
+    _blanksList.forEach((item, index) => {
       gapFillingAnswer.push({ correctAnswerList: item.answerTagList });
+      // if (gapFillingAnswer[index] && gapFillingAnswer[index].correctAnswerList) {
+      //   _gapFillingAnswer[index] = gapFillingAnswer[index]
+      // } else {
+      //   _gapFillingAnswer.push({ correctAnswerList: item.correctAnswerList });
+      // }
       if (item.id === optionItem.id) {
         if (val) {
-          optionItem.answerTagList.push(val);
+          optionItem.correctAnswerList.push(val);
           optionItem.inputVisible = false;
         } else {
           optionItem.errorHold = true;
         }
       }
     });
-    this.setState({ gapFillingAnswer }, () => this._onSetState());
+    console.log(8888, _gapFillingAnswer)
+    this.setState({ gapFillingAnswer: _gapFillingAnswer }, () => this._onSetState());
     this.setState({ blanksList: _blanksList });
   };
 
@@ -569,7 +583,7 @@ class NewQuestionTab extends Component {
     const _blanksList = this.state.blanksList;
     _blanksList.forEach((item) => {
       if (item.id === optionItem.id) {
-        optionItem = optionItem.answerTagList.filter(
+        optionItem = optionItem.correctAnswerList.filter(
           (tag) => tag !== removedTag
         );
       }
@@ -581,13 +595,17 @@ class NewQuestionTab extends Component {
     const _blanksList = this.state.blanksList;
     _blanksList.forEach((item) => {
       if (item.id === optionItem.id) {
-        item.answerTagList.map();
+        item.correctAnswerList.map();
       }
     });
     this.setState({ blanksList: _blanksList });
   };
 
   renderGapFillingAnswer = (optionItem, optionIndex) => {
+    console.log(11111, optionItem)
+    const { gapFillingAnswer } = this.state;
+    console.log(222, gapFillingAnswer)
+    const list = gapFillingAnswer[optionIndex] && gapFillingAnswer[optionIndex].correctAnswerList;
     return (
       <div className="gap-answer-box" key={optionIndex}>
         <span className="gap-answer-label">
@@ -595,7 +613,7 @@ class NewQuestionTab extends Component {
           {optionIndex + 1}.
         </span>
         <div className="gap-answer-content">
-          {optionItem.answerTagList.map((tag, index) => {
+          {list && list.map((tag, index) => {
             return optionItem.editInput ? (
               <Input
                 placeholder={optionItem.errorHold ? "请输入" : ""}
@@ -672,6 +690,7 @@ class NewQuestionTab extends Component {
     contentType,
     validateStatus
   ) => {
+    const { blanksList } = this.state;
     const isGapFilling = this.props.questionTypeKey === "GAP_FILLING";
     const editorContent = _.find(
       contentList,
@@ -701,6 +720,7 @@ class NewQuestionTab extends Component {
             isGapFilling={isGapFilling}
             contentType={contentType}
             mediaBtn={mediaBtn}
+            blanksList={blanksList}
             changeBlankCount={this.changeBlankCount.bind(this)}
             bindChangeContent={(cb, textElemId) => {
               this.setState({ textElemId });
@@ -1031,7 +1051,6 @@ class NewQuestionTab extends Component {
    * @memberof QuestionInputItem
    */
   handleReupload = (uploadItem) => {
-    console.log("uploadItem:", uploadItem);
     uploadItem.status = "init";
     Upload.uploadToOSSEvent(
       uploadItem.mediaFile,
@@ -1128,8 +1147,7 @@ class NewQuestionTab extends Component {
     } = this.state;
     const { stemValidate, stemText, radioValidate, radioText } = this.state;
     const isJudge = this.props.questionTypeKey === "JUDGE";
-    console.log("this.props.questionTypeKey:", this.props.questionTypeKey)
-    console.log("判断：", isJudge)
+
     const isGapFilling = this.props.questionTypeKey === "GAP_FILLING";
     const placehold = isGapFilling ? (
       <span>
@@ -1228,7 +1246,6 @@ class NewQuestionTab extends Component {
                     questionOptionContentList,
                     isCorrectAnswer,
                   } = optionItem;
-                  console.log("questionOptionContentList:", questionOptionContentList)
                   optionItem.optionSort = optionIndex;
                   const mediaBtn = ["VOICE", "RECORD", "PICTURE"];
                   const placeHold =

src/modules/teach-tool/components/QuestionEditor.jsx

@@ -56,12 +56,18 @@ class QuestionEditor extends Component {
   }
 
   shouldComponentUpdate(nextProps, nextState) {
-    const { detailInfo } = nextProps;
+    const { detailInfo, blanksList } = nextProps;
     if (this.state.detailInfo !== detailInfo) {
       this.setState({ detailInfo: nextProps.detailInfo }, () => {
         this.renderEditor();
       });
     }
+    if (blanksList !== this.state.blanksList) {
+      console.log("+++++++", blanksList)
+      this.setState({
+        blanksList
+      })
+    }
     return true;
   }
 
@@ -148,6 +154,7 @@ class QuestionEditor extends Component {
         this.setState({ isShowSingleInput: true });
       }
       if (this.state.isGapFilling) {
+        console.log(9999, this.state.isGapFilling)
         this.props.changeBlankCount(this.state.blanksList);
       }
       this.setState(
@@ -204,7 +211,7 @@ class QuestionEditor extends Component {
   }
 
   insertBlank = (blanks) => {
-    var blanks = `<input class="add-fill-line" disabled answerTagList="" id=${window.random_string(
+    var blanks = `<input class="add-fill-line" disabled correctAnswerList="[]" id=${window.random_string(
       16
     )} value="填空"/>`;
     this.editorRoot.cmd.do("insertHTML", blanks);
@@ -215,7 +222,7 @@ class QuestionEditor extends Component {
     this.setState({
       visiblePlacehold: false,
     });
-    // this.props.changeBlankCount(_blanksList);
+    this.props.changeBlankCount(_blanksList);
   };
 
   render() {