使用初探

步骤：

1、设置组件属性，配置item样式、是否使用快速选集、是否是付费影片等
2、使用组件的setInitData方法，传入总集数totalCount和每次获取的分页大小pageSize
3、监听load-data事件，并在回调方法中调用setPageData方法，设置该页数据

示例代码

点击查看源码

vue


<template>
  <series-base-view :title="this.$options.name" :clipChildren="false">

    <div :clipChildren="false">
      <select-text text="无快速选集样式"/>
      <quick-select-series
          ref="quick_series2"
          :enable-group="false"
          @load-data="onLoadData2"
      />
    </div>

    <div :clipChildren="false">
      <select-text text="快速选集样式"/>
      <quick-select-series
          ref="quick_series1"
          :clipChildren="false"
          @load-data="onLoadData1"
      />
    </div>

    <div :clipChildren="false">
      <select-text text="付费影片样式"/>
      <quick-select-series
          ref="quick_series3"
          :clipChildren="false"
          :is-vip="true"
          @load-data="onLoadData3"
      />
    </div>

  </series-base-view>
</template>

<script>
import {ESPage} from "@extscreen/es-core";
import {onLoadLRData} from "@/components/select-series/utils";
import SeriesBaseView from "@/components/select-series/components/series-base-view.vue";
import SelectText from "@/components/select-series/components/select-text.vue";

export default {
  name: "图文样式",
  components: {SelectText, SeriesBaseView},
  mixins: [ESPage],
  data() {
    return {
      pageSize: 10,
      totalCount: 30
    }
  },
  methods: {
    onLoadData1(event) {
      onLoadLRData(event, this.$refs.quick_series1, this.pageSize, this.totalCount);
    },
    onLoadData2(event) {
      onLoadLRData(event, this.$refs.quick_series2, this.pageSize, this.totalCount);
    },
    onLoadData3(event) {
      onLoadLRData(event, this.$refs.quick_series3, this.pageSize, this.totalCount);
    }
  },
  mounted() {
    this.$refs.quick_series1.setInitData(this.totalCount, this.pageSize);
    this.$refs.quick_series2.setInitData(this.totalCount, this.pageSize);
    this.$refs.quick_series3.setInitData(this.totalCount, this.pageSize);

    setTimeout(() => {
      this.$refs.quick_series1.setSelectChildPosition(0);
      this.$refs.quick_series2.setSelectChildPosition(0);
      this.$refs.quick_series3.setSelectChildPosition(0);
    }, 1000)
  }
}
</script>


<style scoped>

</style>

更多API详见ESSelectSeries组件API

使用初探 ​

步骤： ​

示例代码 ​

使用初探

步骤：

示例代码