javascript - 求救大問題!!!!!這輸出為什麼能不一樣

Question

如圖，為啥這輸出的屬性不一樣？ ？ ？ ？ ？

#

<template>
        <p class="table-p">
            <span @click='change_router'>点我跳转</span><br>
            <ul class="table">
                <li v-for='item in data'>                
                    <p 
                    :class="item.moveYse?'zindex':''"
                    class="content" 
                    @click='start0(item,$event)'
                    @mousedown='moveDown(item,$event)'
                    @mousemove='move0(item,$event)'
                    @mouseup='moveUp(item,$event)'
                    :style="'top:'+item.top+'px;left:'+item.left+'px'">
                        {{item.a}}
                    </p>
                </li>
            </ul>
        </p>
</template>
<script>
export default{
    data(){
        return{
            data: [
                {a:'列表1',top:0,left:0,startX:0,startY:0,moveYse:false},
                {a:'列表2',top:0,left:0,startX:0,startY:0,moveYse:false},
                {a:'列表3',top:0,left:0,startX:0,startY:0,moveYse:false},
                {a:'列表4',top:0,left:0,startX:0,startY:0,moveYse:false},
            ],
        }
    },
    created(){
        var that =this
        setInterval(function () {
          that.msg += 1
        }, 1000)
    },
    watch: {
        
    },
    methods: {        
        change_router() {
            this.$router.push({name:'index'})
        },
        start0(item,e) {
            item.moveYse = true
            // console.log(item,e,'click')
        },
        moveDown(item,e) {
            item.moveYse = true
            console.log(item,e,'down')
            item.startX = e.clientX
            item.startY = e.clientY
        },
        move0(item,e) {
            if (item.moveYse == true) {
                console.log(item,e,item.moveYse,'move')
                item.top = e.clientY - item.startY
                item.left = e.clientX - item.startX 
            }
        },
        moveUp(item,e) {
            item.moveYse = false
            let l = e.clientY - item.startY
            if (l < 50) {
                console.log(l)
                item.startY = 0
                item.startX = 0
                item.top = 0
                item.left = 0
            }else {

            }
            console.log(item.moveYse,item,item.moveYse,'up')
        }
    }
}    
</script>

Answer 1

 moveDown(item,e) {
    item.moveYse = true
    console.log(item,e,'down')
    item.startX = e.clientX
    item.startY = e.clientY
},

moveUp(item,e) {
    item.moveYse = false
    let l = e.clientY - item.startY
    if (l < 50) {
        console.log(l)
        item.startY = 0
        item.startX = 0
        item.top = 0
        item.left = 0
    }else {

    }
    console.log(item.moveYse,item,item.moveYse,'up')
}

在你打印的時候console.log(item.moveYse,item,item.moveYse,'up')的時候，實際上是false,但是在你在控制台裡去點開item對像看的時候，由於執行了moveDown方法，就把item.mouseYse又改回了true.