条件不适用于 DragEnd 事件

Posted 2023-05-08

【中文标题】条件不适用于 DragEnd 事件

【英文标题】：Condition does not work on the DragEnd event

【发布时间】：2021-09-10 08:24:53

【问题描述】：

我学 JS 不到一年。

我正在尝试为拖动事件编写条件，以便在确定数组中的第一个和最后一个元素时考虑该条件并返回 null me。但是由于某种原因，尽管没有错误输出到控制台，但该条件被忽略了。请帮忙。

功能

const onDragEnd = (e) => 
    if (isActive)
        if (e.clientX >= window.innerWidth / 2)
            if (!cardsArray[0])
                setActive(active - 1)
            else return null

        else if (e.clientX <= window.innerWidth / 2)
            if (!cardsArray.length - 1)
                setActive(active + 1)
            else return null

    if (isPrev)
        setActive(active - 1)
    else if (isNext)
        setActive(active + 1)

组件

const cardsList = (
        <motion.div
            className=s.cardsList
            style= transform: `translateX($active * -50%)` 

        >
            
                cardsArray.map(( name, img, link, isDesktop , i) => 

                    const isActive = i === active
                    const isPrev = i < active
                    const isNext = i > active

                    const handleClick = () => 
                        if (isActive)
                            history.push(link)             
                        if (isPrev)
                            setActive(active - 1)
                        else if (isNext)
                            setActive(active + 1)
                    

                    const onDragEnd = (e) => 
                        if (isActive)
                            if (e.clientX >= window.innerWidth / 2)
                                if (!cardsArray[0])
                                    setActive(active - 1)
                                else return null

                            else if (e.clientX <= window.innerWidth / 2)
                                if (!cardsArray.length - 1)
                                    setActive(active + 1)
                                else return null

                        if (isPrev)
                            setActive(active - 1)
                        else if (isNext)
                            setActive(active + 1)

                    

                    return (

                        <Card
                            key=i
                            name=name
                            img=img
                            link=link
                            ...
                                i,
                                isActive,
                                isNext,
                                isPrev,
                                handleClick,
                                isDesktop,
                                onDragEnd
                            
                        />
                    )
                )
            
        </motion.div>
    )

提前感谢您的帮助！

【参考方案1】：

好的，谢谢大家关注我的问题， 但我自己找到了解决方案：

我需要用数组中迭代器的精确指示来补充条件

i != cardsArray[0]

第二种情况类似

i != cardsArray.length - 1

就是这样，伙计们！ 我希望帮助别人做出自我决定