Ngx-drag-scroll: بديل معطل السحب التمرير للأطفال

مرحبًا ، CrackerakiUA . هل جربت [drag-scroll-disabled]="disabled" ؟

إضافة الرمز أدناه

 dragScroll drag-scroll-y-disabled='true' snap-disabled='true' [drag-scroll-disabled]="bool"

وفي مكان الطفل:

 (mouseenter)="bool=true" (mouseleave)="bool=false"

أيضًا تقديم منطقي لمعرفة ما إذا كان يتغير. [drag-scroll-disabled] يعمل على قيمة البداية وعندما أقوم بتغيير المتغير ، فإنه لا يتغير. غريب لأنه في مثالك تبديل يعمل.

صححني إذا كنت مخطئا. بشكل أساسي ، تريد drag-scroll-disabled لتعطيل mouseenter ، و mouseleave لجميع العناصر الفرعية في حاوية التوجيه.

الأمر ليس كما هو الحال بالنسبة لجميع عناصر الأطفال ، فستكون الميزة الرائعة هي إضافة سمة إلى أي طفل وسيتم إلغاء تمرير سحب الطفل هذا (بطريقة تعمل stopPropagation). يسعدني تنفيذ هذه الميزة ، إذا أرشدتني.

من الناحية النظرية ، إذا قمت بتطبيق العرض التوضيحي الخاص بك ، فمن المفترض أن يعمل بشكل جيد ، ولكن في حالتي ، لدي الكثير من العناصر في تلك الحاوية وتعطيل لا يعمل بشكل جيد.

هل لديك مقتطف رمز للمشاركة؟ أو يمكنك أن تفرّق التطبيق التجريبي وتوضح لي ماذا تقصد بالضبط؟ أواجه صعوبة في تصور حالة الاستخدام من خلال قراءة الكود أو العرض التوضيحي.

<div class="container" dragScroll drag-scroll-y-disabled="true" snap-disabled="true">
    <header title="This should drag background">Something is here</header>
    <div drag-scroll-disable title="No drag background">Content</div>
    <div drag-scroll-disable title="No drag background">Content</div>
    <div drag-scroll-disable title="No drag background">Content</div>
    <div drag-scroll-disable title="No drag background">Content</div>
    <div drag-scroll-disable title="No drag background">Content</div>
    <footer title="This should drag background">Something else</footer>
    <!-- everything else should also drag background -->
</div>

يرجى التحقق من الكود ، إذا لم يوضح ذلك الفكرة ، فسأقدم عرضًا توضيحيًا.

شكرًا CrackerakiUA ، drag-scroll-item لتمييز جميع العناصر التابعة. بمجرد إصدار 2.0.0 ، يمكنني إضافة هذه الميزة مباشرة بعد ذلك.

رائع ، هل تعرف متى سيكون ذلك ، هل تحتاج إلى أي مساعدة في ذلك؟

تم رفع مستوى العلاقات العامة لـ 2.0 https://github.com/bfwg/ngx-drag-scroll/pull/145. أنا أقوم فقط بمجموعة من الاختبارات للتأكد من عدم وجود تراجع. هنا هو README الجديد https://github.com/bfwg/ngx-drag-scroll/blob/7592e3b08894ce23347c392c3fb88fc4c545323b/README.md

سيكون رائعًا إذا كان بإمكانك منح هذه العلاقات العامة جولة حتى نتمكن من جعلها تعيش بشكل أسرع. شكرا!

عنصر السحب التمرير
يبدو رائعًا ، من الممكن أيضًا استخدام شيء مثل
تجاهل السحب التمرير البند
تخيل مثالًا مثل trello حيث لديك أعمدة لا تسحب الخلفية.

نعم ، أفكر في إضافة عنصر السحب والتمرير drag-scroll-disabled" attribute in the لتعطيل التطبيق الأصلي من السحب والتمرير. ما رأيك؟

مرحبا ، أي تقدم في هذا؟

كان في أحد فروع العمل الخاصة بي ونسيت أمره. سأدفع تغييراتي وآمل أن أدخلها بحلول اليوم. آسف لذلك 😅

يبدو لطيفا ، شكرا لك

التغيير في 7.1.0. يمكنك إضافة سمة "pull-disable" إلى العنصر الفرعي ، وستقوم بتعطيل السحب على هذا العنصر.

تقرر في رقم 205

مرحبًا ، لقد اختبرت 7.1.0 وهي لا تعمل :(
المثال الخاص بي:

<drag-scroll [drag-scroll-y-disabled]="true">
    <task drag-disabled></task>
    <task drag-disabled></task>
    <task drag-disabled></task>
    <task drag-disabled></task>
    <task drag-disabled></task>
    <task drag-disabled></task>
</drag-scroll>

يفتقد عنصر المهمة إلى السمة drag-scroll-item .

 <drag-scroll [drag-scroll-y-disabled]="true">
    <task drag-scroll-item drag-disabled></task>
    <task drag-scroll-item drag-disabled></task>
    <task drag-scroll-item drag-disabled></task>
    <task drag-scroll-item drag-disabled></task>
    <task drag-scroll-item drag-disabled></task>
    <task drag-scroll-item drag-disabled></task>
</drag-scroll>

مباشرة بعد إضافة drag-scroll-item إيقاف التمرير بالسحب للعمل. جرّبت الحالة التي أضفتها وأيضًا:

 <drag-scroll [drag-scroll-y-disabled]="true" drag-scroll-item>
    <task drag-disabled></task>
    <task drag-disabled></task>
    <task drag-disabled></task>
    <task drag-disabled></task>
    <task drag-disabled></task>
    <task drag-disabled></task>
</drag-scroll>

والسيناريو التالي:

<drag-scroll [drag-scroll-y-disabled]="true">
    <ng-container drag-scroll-item>
        <task drag-disabled></task>
        <task drag-disabled></task>
        <task drag-disabled></task>
        <task drag-disabled></task>
        <task drag-disabled></task>
        <task drag-disabled></task>
    </ng-container>
</drag-scroll>

هذا غريب. هل يمكنك إعادة الإنتاج في التطبيق التجريبي لأنه يعمل بشكل جيد بالنسبة لي.

لقد استخدمت مثالك وصنعت شيئًا مثل ما يلي لا يعمل:

<drag-scroll class="demo-one"
  drag-scroll-y-disabled="true"
  scrollbar-hidden="true"
  (dsInitialized)="onDragScrollInitialized()"
  (indexChanged)="onIndexChanged($event)"
  (reachesLeftBound)="leftBoundStat($event)"
  (reachesRightBound)="rightBoundStat($event)"
  (snapAnimationFinished)="onSnapAnimationFinished()"
  #nav
  >
  <ng-container *ngFor="let image of imagelist; let i = index;" drag-scroll-item>
    <img *ngIf="i%2==0" [src]="'assets/img/' + image" (click)="clickItem(image)" title="{{i}}" drag-disabled/>
    <img *ngIf="i%2!=0" [src]="'assets/img/' + image" (click)="clickItem(image)" title="{{i}}"/>
  </ng-container>

</drag-scroll>

في الواقع ، يبدو أن drag-scroll-item لا يعمل كما يفترض أن الحاوية drag-scroll لديها القدرة على السحب.

bfwg هل يعمل المثال الخاص بي في

bfwg بماذا ولماذا؟ باستخدام كتل السحب-التمرير ، جميع عناصر نوع صورة السحب الأشباح على موقع الويب ، لا يمكنني العثور على كيفية إصلاح ذلك

هذه المشكلة نسخة مزدوجة ، يرجى الاطلاع على تعليقاتي https://github.com/bfwg/ngx-drag-scroll/issues/223#issuecomment -494259349

لقد أشرت إلى المشكلة. تضمين التغريدة