有人知道这叫什么吗？我想在我的应用程序中创建一个类似的功能，但我不知道它叫什么，以便能够搜索如何做到这一点的方法。
我创建了内容可编辑的div，然后添加了onInput事件

function onStateAddHandler(e){
    let wordArray = []
    const words = e.target.innerText.split(',').filter(word => word.trim() != '')
    words.forEach(word => {
        const filteredWord = word.replace(/\s/g, '')

        wordArray.push(filteredWord)
    })
    setStates(wordArray)
   }

之后我试着创建一个div，添加文本到其中，并将其附加到div中，内容可以使用ref编辑，如下所示：

function onStateAddHandler(e){
    let wordArray = []
    const words = e.target.innerText.split(',').filter(word => word.trim() != '')
    words.forEach(word => {
        const filteredWord = word.replace(/\s/g, '')

        let div = document.createElement('div')
        let content = document.createTextNode(filteredWord)

        div.append(content)

        statesDiv.current.appendChild(div)
        wordArray.push(filteredWord)
    })
    setStates(wordArray)
   }

但我最终得到了这个灾难性的输出，我认为这是因为追加的div也会被我的函数过滤，然后被推送到数组中，但老实说，我从早上开始就一直在尝试找到一种方法，但没有任何效果。