mint ui解決Navbar和Infinite scroll共存時的bug

Navbar和Infinite scroll共同使用時會出現無限加載的問題,滑動也會出現亂加載。html

只須要判斷一下就能夠了,代碼:this

html:spa

    <mt-navbar v-model="selected">
      <mt-tab-item id="aa" @click.native.prevent="showAA">option A</mt-tab-item>
      <mt-tab-item id="bb" @click.native.prevent="showBB">option B</mt-tab-item>
    </mt-navbar>


    <mt-tab-container v-model="selected">
      <mt-tab-container-item id="aa">
        <ul v-if="selected == 'aa'" v-infinite-scroll="addAAList" infinite-scroll-disabled="aaloading" infinite-scroll-distance="10">
          <li v-for="i in arr1">{{i}}</li>
        </ul>
      </mt-tab-container-item>
      <mt-tab-container-item id="bb">
        <ul v-if="selected == 'bb'"  v-infinite-scroll="addBBList" infinite-scroll-disabled="bbloading" infinite-scroll-distance="10">
          <li v-for="i in arr2">{{i}}</li>
        </ul>
      </mt-tab-container-item>
    ... </mt-tab-container>

 

js:code

    data() {
      return {
        selected: 'aa',
        arr1: [],
        aal: false,
        ...
      }
    },

    methods: {
      showAA() {
        this.aal = true;
        for (let i = 0; i < 10; i++) {
          this.arr1.push('AA = ' + (this.arr1.length + 1));
        }
        this.aal = false;
      },
      showBB() {
     ... }, },
相關文章
相關標籤/搜索