job/node_modules/lin-ui/dist/water-flow/index.js

Component({
  /**
  * 组件的属性列表
  */
  properties: {
    columnGap: {
      type: String,
      value: '20rpx'
    }
  },

  /**
  * 组件的初始数据
  */
  data: {
    data: [],
    leftData: [],
    rightData: []
  },

  attached() {
    this._init();
  },

  pageLifetimes: {
    show() {
      this._init();
    }
  },
  /**
   * 组件的方法列表
   */
  methods: {
    _init() {
      wx.lin = wx.lin || {};
      wx.lin.renderWaterFlow = (data = [], refresh = false, success) => {
        if (Object.prototype.toString.call(data) !== '[object Array]') {
          console.error('[data]参数类型错误，渲染失败');
          return false;
        }
        // 绑定data，判断data是否为[]
        this.setData({ data });
        if (refresh) {
          this.data.leftData = [];
          this.data.rightData = [];
        }
        this._select(data, refresh).then(() => {
          success && success();
        });
      };
    },
    _select(data, refresh) {
      const query = wx.createSelectorQuery().in(this);
      this.columnNodes = query.selectAll('#left, #right');
      return new Promise((resolve) => {
        this._render(data, 0, refresh, () => {
          resolve();
        });
      });
    },
    _render(data, i, refresh, success) {
      if ((data.length > i || refresh) && this.data.data.length !== 0) {
        this.columnNodes.boundingClientRect().exec(res => {
          const rects = res[0];
          this.data.leftHeight = rects[0].height;
          this.data.rightHeight = rects[1].height;
          if (this.data.leftHeight <= this.data.rightHeight || refresh) {
            this.data.leftData.push(data[i]);
          } else {
            this.data.rightData.push(data[i]);
          }

          this.setData({
            leftData: this.data.leftData,
            rightData: this.data.rightData
          }, () => {
            this._render(data, ++i, false, success);
          });
        });
      } else {
        success && success();
      }
    }
  }
});