I read this page
https://jsfiddle.net/dede89/s25p19hj/
add scroll-sensitivity="190" :force-fallback="true"
item can't onclick event
My Code:
Code Begin:
<draggable :animation="400" :scroll-sensitivity="250" :force-fallback="true" @start="filedStart2" :list = "t.filedList" @end="filedEnd" group="testList" :disabled="editable">
<div v-for="(f,fi) in t.filedList" :id="'filed'+f.archiveDetailUUID" :sort="true" class="file_width">
<div class="f_file_a file_width file_hover hover_close_vx1"
style="cursor: pointer;" @click="toShowPdf(f)" >
<div class="ffa_child border_grey">
<img style="width: 75px; height: 85px;" class="img_block" :src="'/static/img/pdf_icon.png'">
</div></div>
</div>
</draggable>
Code End:
@click="toShowPdf(f)" can't run toShowPdf this function
Use handle option to make only a part of the item draggable and preseve original event on remaining elment.
I Fix it,thanks ,this is Code:
<draggable :animation="400" :scroll-sensitivity="250" :fallback-tolerance="1" :force-fallback="true"
:list = "t.filedList" @start="filedStart2" @end="filedEnd" group="testList" :disabled="editable">
<div v-for="(f,fi) in t.filedList" :id="'filed'+f.archiveDetailUUID" :sort="true" class="file_width">
<div @click="toShowPdf(f)" >
<div class="ffa_child border_grey">
<img style="width: 75px; height: 85px;" class="img_block" :src="'/static/img/pdf_icon.png'">
</div>
</draggable>
It is helpful to me, successfully solved my problem, thank you!
@smartwei thanks
:fallback-tolerance="1"
Solved my problem
Most helpful comment
I Fix it,thanks ,this is Code:
<draggable :animation="400" :scroll-sensitivity="250" :fallback-tolerance="1" :force-fallback="true" :list = "t.filedList" @start="filedStart2" @end="filedEnd" group="testList" :disabled="editable"> <div v-for="(f,fi) in t.filedList" :id="'filed'+f.archiveDetailUUID" :sort="true" class="file_width"> <div @click="toShowPdf(f)" > <div class="ffa_child border_grey"> <img style="width: 75px; height: 85px;" class="img_block" :src="'/static/img/pdf_icon.png'"> </div> </draggable>