lyfeyaj / swipe

Swipe is the most accurate touch slider. Support both React and Angular.

Home Page:https://swipe.js.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

react 版本的需要更新一下,升级到16.13.1,应该是16.8以后,componentWillReceiveProps 不建议使用了,等到17就正式不让使用了,麻烦更新一下。

dxhuii opened this issue · comments

commented

如题,把一些提示 UNSAFE_ 更新一下。

commented

我自己写了一下,我这边不好测试

constructor(props) {
    super(props);
    this.state = {};

    this.needsReSetup = false;
    this._isMount = false;
    this.instance = null;
  }

修改

constructor(props) {
    super(props);
    this.state = {
      needsReSetup: false
    };
    this._isMount = false;
    this.instance = null;
  }

componentWillReceiveProps(nextProps) {
    let nextChildrenLength = (nextProps.children || []).length;
    let prevChildrenLength = (this.props.children || []).length;
    if (nextChildrenLength !== prevChildrenLength) {
      this.needsReSetup = true;
    }
  }

修改为

// Check children length change and prepare for re-setup
  static getDerivedStateFromProps(props, state) {
    const nextChildrenLength = (props.children || []).length
    const prevChildrenLength = (state.prevChildren || []).length
    if(nextChildrenLength !== prevChildrenLength) {
      return {
        prevChildren: nextChildrenLength,
        needsReSetup: true
      }
    }
    return null;
  }

componentDidUpdate() {
    if (this._isMount && this.needsReSetup) {
      this.setupSwipe();
      this.needsReSetup = false;
    }
  }

修改为

componentDidUpdate() {
    if (this._isMount && this.state.needsReSetup) {
      this.setupSwipe();
      this.setState({
        needsReSetup: false
      })
    }
  }