Question

我尝试使用ion-reorder创建带有拖放元素的列表。当我直接将其放入 ion-content 中时，效果很好。

   <ion-content>
        <ion-list>
            <ion-reorder-group (ionItemReorder)="reorderItems($event)" disabled="false">
                <ion-item *ngFor="let item of items">
                    <ion-label>
                        {{ item }}
                    </ion-label>
                    <ion-reorder slot="start">
                        <ion-icon name="pizza"></ion-icon>
                    </ion-reorder>
                </ion-item>
            </ion-reorder-group>
        </ion-list>
    </ion-content>

但是我的问题是我的组件是一个嵌套组件，而 ion-content 位于页面的顶部（组件位于 ion-content 和我的可拖动列表）。然后，在这种情况下，无法拖动和滚动元素。例如，当我拖动和滚动元素时，这将不起作用。

<ion-content>
    <div style="height: 200px; width: 100%; overflow-y: auto">
        <ion-list>
            <ion-reorder-group (ionItemReorder)="reorderItems($event)" disabled="false">
                <ion-item *ngFor="let item of items">
                    <ion-label>
                        {{ item }}
                    </ion-label>
                    <ion-reorder slot="start">
                        <ion-icon name="pizza"></ion-icon>
                    </ion-reorder>
                </ion-item>
            </ion-reorder-group>
        </ion-list>
    </div>
</ion-content>

因此，要正常工作， ion-reorder-group / ion-reorder 必须直接位于 ion-content 内部，但只能是一个 ion-content 。我该如何处理？

<ion-reorder>拖放到可滚动的div中

0 个答案: