Ionic 3 Infinite Scroll'无法读取null的属性时间戳'

时间:2017-12-11 16:12:49

标签: ionic2 infinite-scroll

所以我使用无限滚动来加载一个非常大的反应形式。 但是我注意到,如果在无限滚动加载其他项目时触发了表单输入事件,则会发生这种情况。

    ERROR TypeError: Cannot read property 'timeStamp' of null
    at InfiniteScroll._onScroll (infinite-scroll.js:229)
    at SafeSubscriber.schedulerFn [as _next] (core.es5.js:3647)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:238)
    at SafeSubscriber.next (Subscriber.js:185)
    at Subscriber._next (Subscriber.js:125)
    at Subscriber.next (Subscriber.js:89)
    at EventEmitterProxy.Subject.next (Subject.js:55)
    at EventEmitterProxy.EventEmitter.emit (core.es5.js:3621)
    at ScrollView.scroll.onScroll (content.js:378)
    at ScrollView.setScrolling (scroll-view.js:52)
    at ScrollView.scrollTo (scroll-view.js:401)
    at Content.scrollTo (content.js:433)
    at TextInput._jsSetFocus (input.js:524)
    at TextInput._pointerEnd (input.js:496)
    at Object.eval [as handleEvent] (TextInput.ngfactory.js:130)
    at Object.handleEvent (core.es5.js:11998)
    at Object.handleEvent (core.es5.js:12717)
    at dispatchEvent (core.es5.js:8614)
    at core.es5.js:9228
    at HTMLDivElement.<anonymous> (platform-browser.es5.js:2648)
    at HTMLDivElement.wrapped (raven.js:350)
    at t.invokeTask (polyfills.js:3)
    at Object.onInvokeTask (core.es5.js:3881)
    at t.invokeTask (polyfills.js:3)
    at r.runTask (polyfills.js:3)
    at e.invokeTask [as invoke] (polyfills.js:3)
    at p (polyfills.js:2)
    at HTMLDivElement.v (polyfills.js:2)
    console.(anonymous function)    @   console.js:32
    defaultErrorLogger  @   core.es5.js:1020
    ErrorHandler.handleError    @   core.es5.js:1080
    IonicErrorHandler.handleError   @   ionic-error-handler.js:61
    webpackJsonp.381.SentryErrorHandler.handleError @   sentry-
    errorhandler.ts:11
    (anonymous) @   core.es5.js:9232
    (anonymous) @   platform-browser.es5.js:2648
    wrapped @   raven.js:350
    t.invokeTask    @   polyfills.js:3
    onInvokeTask    @   core.es5.js:3881
    t.invokeTask    @   polyfills.js:3
    r.runTask   @   polyfills.js:3
    e.invokeTask    @   polyfills.js:3
    p   @   polyfills.js:2
    v   @   polyfills.js:2

这真的让我发疯,因为即使试试捕获也不能阻止此错误导致应用程序崩溃。 我需要帮助!!

4 个答案:

答案 0 :(得分:3)

这是一个当前的离子问题,遗憾的是它不会在v4之前修补。

bug(infinite-scroll): throws uncatchable error if scrollToTop is called before it is resolved

尝试避免问题的最快方法(每次都不起作用)是在scrollToTop / scrollToBottom周围包装一个setTimeout

class VideoPlayer extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      interval: undefined,
      ctx: undefined
    };

    this.grabFrame = this.grabFrame.bind(this);
  }

  componentDidMount() {
    this.setState({
      ctx: this.canvas.getContext("2d")
    });
  }

  grabFrame() {
    return this.state.ctx.drawImage(this.video, 0, 0, 400, 220);
  }

  play() {
    if (this.video.paused) {
      if (this.state.interval) {
        clearInterval(this.state.interval);
      }
      this.video.play();
      this.setState({
        interval: setInterval(this.grabFrame, 1000 / this.props.fps)
      });
    } else {
      clearInterval(this.state.interval);
      this.setState({
        interval: undefined
      });
      this.video.pause();
    }
  }

  render() {
    return (
      <div>
        <video width="400" ref={video => (this.video = video)} id="v">
          <source
            src="https://www.w3schools.com/html/mov_bbb.mp4"
            type="video/mp4"
          />
        </video>
        <canvas
          ref={canvas => (this.canvas = canvas)}
          width="400"
          height="220"
        />
        <br />
        <button type="button" onClick={this.play.bind(this)}>
          Play
        </button>
      </div>
    );
  }
}

答案 1 :(得分:0)

我遇到了类似的问题,遇到了这个问题:

TypeError: Cannot read property 'enableEvents' of null at EventEmitterProxy.enableScrollListener [as onSubscribe]

在另一个Ionic页面上的某个功能刷新了我们应用程序中的外部内容之后,就会间歇性地发生这种情况。我从未弄清楚确切的原因,但是我注意到它仅在用户与原始页面交互期间的某个时刻触发无限滚动时才发生。

在我们的例子中,我将InfiniteScroll实例设置为局部的组件级变量,以便可以在其他函数中以编程方式使用.enable()钩子,例如:

查看:

<ion-infinite-scroll (ionInfinite)="lazyLoad($event)"> ...

控制器:

  public lazyLoad(infiniteScroll: InfiniteScroll) { 
     // ASSIGN THE LAZY LOADER INSTANCE ON FIRST RUN SO IT CAN BE ENABLED / DISABLED ELSEWHERE
     this.lazyLoader = infiniteScroll;
     ....
  }

但是,然后我们在刷新内容时会随机遇到上述TypeError,因此几乎就像是某个地方试图引用该变量的调用。因此,我只是在页面离开视图时将变量设置为null,现在它可以工作了。怪异的

(注意:所有对InfiniteScroll实例的调用都包装在if (this.lazyLoader && this.lazyLoader !== null)门中,因此我不确定到底出了什么问题)

  ionViewWillLeave() {
     this.lazyLoader = null;
  }

答案 2 :(得分:0)

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({...})
export class MyPage{
  scrollToTop() {
    this.navCtrl.setRoot('MyPage'); //so you will go to the top of page.
  }
}

答案 3 :(得分:0)

转到infinite-scroll.js 检查ev是否为null 如果为null,则返回3; //什么都不做