无法读取未定义的读取“indexOf”的属性

问题描述 投票:0回答:1

这是我的代码,我按照视频教程重写了它,但它给出了错误,请告诉我该怎么办? 在此之前,显示了有关密钥的错误,但我检查了它们 对不起?我不知道,这个写什么,所以 abcdocdbsdbjsdcjsbd svdcjcb sjdv sjd


const App = () => {
    const [boards, setBoards] = useState ([
        {id: 1, title: "Не начато", items: [{id: 1, title:"a"}, {id:2, title:"b"}, {id:3, title:"c"}] }
    ])

    const [currentBoard, setCurrentBoard] = useState(null)
    const [currentItem, setCurrentItem] = useState(null)

    function dOH (e){ e.preventDefault() }
    function dLH (e){}
    function dSH (e, board, item){
        setCurrentBoard(board)
        setCurrentItem(item)
    }
    function dEH (e){}


    function drop(e, board, item) {
        e.preventDefault()
        const currentIndex = currentBoard.item.indexOf(currentItem)
        currentBoard.items.splice(currentIndex, 1)
        const dropIndex = board.items.indexOf(item)
        board.items.splice(dropIndex + 1, 0, currentItem)
        setBoards(boards.map(b => {
            if(b.id === board.id){
                return board
            }
            if(b.id === currentBoard.id){
                return currentBoard
            }
            return b
        }))

    }
    return (
        <div>
            {boards.map (board =>
            <div>
                <div>{board.title}</div>
                {board.items.map (item =>
                    <div 
                    onDragOver={(e) => dOH(e)}
                    onDragLeave={(e) => dLH(e)}
                    onDragStart={(e) => dSH(e, board, item)}
                    onDragEnd={(e) => dEH(e)}
                    onDrop={(e) => drop(e, board, item)}
                    draggable={true}>{item.title} </div>)}
            </div>
            )}
        </div>
    )
}

export default App```


I tried to rewrite the code as in other tips, but it didn't work out.        
reactjs
1个回答
0
投票

以下声明中有一个错别字。属性项不正确,是物品。

原代码

function drop(e, board, item) {
   ...
   const currentIndex = currentBoard.item.indexOf(currentItem)
   ...
}

更正代码

function drop(e, board, item) {
   ...
   const currentIndex = currentBoard.items.indexOf(currentItem)
   ...
}

修复拼写错误进行测试运行

a) 加载应用程序时

Browser display - On load of the app

b) 将 a 拖放到 b 上之后

Browser display - After the drag and drop of a onto b

c) 将 a 拖放到 c 上之后

Browser display - After the drag and drop of a onto c

© www.soinside.com 2019 - 2024. All rights reserved.