Question

我在离子滑块内部有一个组件，它的滚动条不起作用

这是我的代码：

<ion-slide style="height:100%">
  <main-search></main-search>
</ion-slide>

<ion-slide>

    <div style="height:100%">Page 2 </div>

</ion-slide>

Answer 1

请尝试以下操作：

INSERT INTO temp1 VALUES(1, 2, 3);INSERT INTO temp2 VALUES(1, 2, 3);

https://forum.ionicframework.com/t/ionic-scroll-within-ionic-slide-not-working/47099/7

Answer 2

请尝试以下代码：

.html

<ion-slides [options]="slideOpts"
                pager="true">
      <ion-slide>
        <ion-list>
          <ion-item>
            <h2>Some title1</h2>
          </ion-item>
          <ion-item>
            <h2>Some title2</h2>
          </ion-item>
          <ion-item>
            <h2>Some title3</h2>
          </ion-item>
          <ion-item>
            <h2>Some title4</h2>
          </ion-item>
          <ion-item>
            <h2>Some title5</h2>
          </ion-item>
          <ion-item>
            <h2>Some title45</h2>
          </ion-item>
          <ion-item>
            <h2>Some title46</h2>
          </ion-item>
        </ion-list>
      </ion-slide>

      <ion-slide>
        <ion-list>
          <ion-item>
            <h2>Some title1</h2>
          </ion-item>
          <ion-item>
            <h2>Some title2</h2>
          </ion-item>
          <ion-item>
            <h2>Some title3</h2>
          </ion-item>
          <ion-item>
            <h2>Some title4</h2>
          </ion-item>
          <ion-item>
            <h2>Some title5</h2>
          </ion-item>
          <ion-item>
            <h2>Some title45</h2>
          </ion-item>
          <ion-item>
            <h2>Some title46</h2>
          </ion-item>
          <ion-item>
            <h2>Some title1</h2>
          </ion-item>
          <ion-item>
            <h2>Some title2</h2>
          </ion-item>
          <ion-item>
            <h2>Some title3</h2>
          </ion-item>
          <ion-item>
            <h2>Some title4</h2>
          </ion-item>
          <ion-item>
            <h2>Some title5</h2>
          </ion-item>
          <ion-item>
            <h2>Some title45</h2>
          </ion-item>
          <ion-item>
            <h2>Some title46</h2>
          </ion-item>
        </ion-list>
      </ion-slide>
    </ion-slides>

.ts

  slideOpts = {
      initialSlide: 0,
      speed: 500
  };

.scss

用于垂直滚动

ion-slides{
  overflow-y: scroll;
}

用于水平滚动

ion-slides{
  overflow-x: scroll;
}

离子4，离子滑动垂直滚动不起作用

2 个答案: