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

时间:2019-02-24 17:54:24

标签: angular ionic-framework angular7 ionic4 ion-slides

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

这是我的代码:

              {{标签}}     

                

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

<ion-slide>

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

</ion-slide>

2 个答案:

答案 0 :(得分: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

答案 1 :(得分:0)

请尝试以下代码:

.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;
}