0

我有 2 个动态对象数组。1 代表status， 1 代表tickets。

对象的内容是：

//Status object | status_list    
[
 {id: 1, name: 'UN ASSIGNED'},
 {id: 2, name: 'TO DO'},
 {id: 3, name: 'IN PROGRESS'},
 {id: 4, name: 'DONE'}
]

//Tickets object | tickets_array
[
 {status_id: 1, data:{id: 1, name: 'Ticket 1', stat_id: 1} },
 {status_id: 1, data:{id: 3, name: 'Ticket 3', stat_id: 1} },
 {status_id: 2, data:{id: 6, name: 'Ticket 6', stat_id: 2} }
]

所以用户界面是这样的......

| UN ASSIGNED |   |   TO DO   |   |  IN PROGRESS  |   |   DONE   |
---------------   -------------   -----------------   ------------
|   TICKET 1  |   | TICKET 6  |   |               |   |          |
|   TICKET 1  |   |           |   |               |   |          |
|             |   |           |   |               |   |          |

UN ASSIGNED现在，我可以自由地从toTO DO和同样地拖动。但是，我不能将任何东西拖入IN PROGRESSand DONE。原因是该<draggable>组件有一个名为的属性:list="ticket_array"，我们知道 和 的 idIN PROGRESS不DONE存在于ticket_array.

这是我渲染它的方式...

<div v-for="(status, index) in status_list" :key="index">
    <div class="status_box_content">
        <div class="status_box_header">
            <h2 dir="auto">{{status.name}}</h2>
                <div class="_draggable">
                    <div v-for="(cated_tix, index2) in tickets_array" :key="index2">
                        <template v-if="index == index2 && cated_tix.status_id == status.id">
                            <draggable class="dragArea" :list="list_array[index].data" group="people" @change="_transferTickets">
                                <vs-card v-for="(tix,tix_index) in cated_tix.data" :key="tix.id">
                                    {{tix.name}}
                                </vs-card>
                            </draggable>
                        </template>
                    </div>
                </div>
            </div>
        </div>
    </div>

渲染当然没有问题，但问题是我不能将任何东西拖到空类别中。任何人？

4

0 回答 0