0

我是 IONIC 世界的新手。目前我正在将一个 Web 应用程序从 ioinc1.7.16+angularjs+javascript 迁移到最新版本，即 ionic 3.10.0+angular5+typescript。我正在使用 Windows 8.1 操作系统。我正在使用 Node v8.9.1、npm v5.5.1、ionic 3.20.0、cordova 8.0.0。

在我现有的应用程序中，离子滚动工作正常。我的意思是水平滚动条不可见，但可以使用鼠标平滑地单击并拖动或向左/向右滑动容器。我的滚动容器只包含一个图像列表。

问题：但是在我使用 ionic 3.20.0 的迁移 Web 应用程序中，同样的水平滚动单击和拖动或向左/向右滑动不起作用

自上周以来，我一直在努力使其工作，但没有运气。谁能帮我解决这个问题？

这是我迁移的代码：

HTML

<ion-content>
  <ion-scroll scrollX="true">
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
      <div class="inline"><img src="https://placehold.it/400x400" /></div>
  </ion-scroll>
</ion-content>

SCSS

page-home { 
     .inline{
         display: inline-block;
     }

     ion-scroll{
         white-space: nowrap; 
         height: 400px;
         width: 600px;
     } 
}
4

1 回答 1

0

你的代码看起来不错。单击和拖动时滑动在浏览器上不起作用。在设备上测试它。它应该工作正常。

于 2018-05-21T15:57:20.500 回答