拖放后我无法更新某些组件

问题描述

我正在尝试重新排列问题列表。

我面临的问题是，拖放页面后，页面不是我所期望的，重新渲染后某些字段没有更改。在重新排序之前，我有

重新排序后我有

通过检查我有列表被正确修改，但在页面中，一些输入是固定的

这是代码

     setQuestions(old => {
           
            //find our dropped questions
            const movedItem = old.find(( _,index) => index === source.index);
            //  // use filter to remove item from it's position 
            const remainingItems = old.filter(( _,index) => index !== source.index);
         
            old = [
                ...remainingItems.slice(0,destination.index),movedItem,...remainingItems.slice(destination.index)
            ]
           //return the array qyestion update
            return [...old]
        })
      }


    return (
    /**
     * DragDropContext is a container where we define the principal area of  our DnD question
     * Droppable define a column where are draggable element
     * draggable define component we want to apply DnD to
     */
       
        <DragDropContext onDragEnd={onDragEnd}>
        <Droppable droppableId="droppable">
          {(provided,snapshot) => (
            <div
              {...provided.droppableProps}
              ref={provided.innerRef}
              style={getListStyle(snapshot.isDraggingOver)}
            >
              {questions.map((question,index) => (
                <Draggable key={index} draggableId={String(index) } index={index}>
                  {(provided,snapshot) => (
                    <div
                      ref={provided.innerRef}
                      {...provided.draggableProps}
                      {...provided.dragHandleProps}
                      style={getItemStyle(
                        snapshot.isDragging,provided.draggableProps.style
                      )}
                    >
                        <Question key={index} index={index} question={question}
                        questions={questions} setQuestions={setQuestions} />
                   
                    </div>
                  )}
                </Draggable>
              ))}
              {provided.placeholder}
            </div>
          )}
        </Droppable>
      </DragDropContext>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）