0

我正在设置一个管理员门户，管理员门户可以输入无限数量的步骤。每个步骤都包含一个标题和一段 HTML 字符串形式的富文本。目前我的代码有效，但是当我使用箭头增加步数或在输入字段中输入 10 个或更多步时出现此错误。

未捕获的错误：您将事件中的delta对象onChange作为value. 你很可能想要editor.getContents()

看起来像一个 React-Quill 特定的错误，但有些东西让我认为这个错误是我某处代码错误的副作用。

这是我的代码：

export const NewsArticlesPage = () => {

      const [numberOfSteps, setNumberOfSteps] = useState(0)
      //@ts-ignore
      const StepsMap = Array.apply(null, { length: numberOfSteps })
    
      let richText: any = { ...StepsMap }
      let title: any = { ...StepsMap }
    
      const updateTileArray = (index: number, titleEventData: string) => {
        const titleData = { ...title }
        title = { ...titleData, [index]: titleEventData }
        console.log(title[index])
      }
    
      const updateRichTextArray = (index: number, richTextEventData: string) => {
        const richTextData = { ...richText }
        richText = { ...richTextData, [index]: richTextEventData }
        console.log(richText[index])
      }
    
      const updateNewsArticleJson = () => {
        console.log(richText)
        console.log(title)
      }
    
      return (
        <NewsArticlesWrapper>
          <TextField
            type="number"
            label="Number of steps"
            value={numberOfSteps}
            InputProps={{ inputProps: { min: 0 } }}
            onChange={(e) => setNumberOfSteps(Number(e.target.value))}
          />
          {StepsMap.map((n, index) => (
            <>
              <Typography key={'heading' + index}>Step: {index + 1}</Typography>
              <TextField
                key={'title' + index}
                type="text"
                label="Title"
                value={title[index]}
                onChange={(titleEventData) =>
                  updateTileArray(index, titleEventData.target.value)
                }
              />
              <ReactQuill
                key={'quil' + index}
                theme="snow"
                value={richText[index]}
                modules={modules}
                onChange={(richTextEventData) =>
                  updateRichTextArray(index, richTextEventData)
                }
              />
            </>
          ))}
          <Button
            variant="contained"
            colour="primary"
            size="medium"
            onClick={updateNewsArticleJson}
          >
            Submit Article
          </Button>
        </NewsArticlesWrapper>
      )
    }

我知道使用 any 类型是不好的，但我的首要任务是让它工作，然后我可以添加正确的类型。

4

0 回答 0