|
|
@@ -0,0 +1,103 @@
|
|
|
+// components/My_categoryListings/index.js
|
|
|
+Component({
|
|
|
+ /**
|
|
|
+ * 组件的属性列表
|
|
|
+ */
|
|
|
+ properties: {
|
|
|
+ height: {
|
|
|
+ type: String,
|
|
|
+ value: '500'
|
|
|
+ },
|
|
|
+ list: {
|
|
|
+ type: Array,
|
|
|
+ value: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ options: {
|
|
|
+ addGlobalClass: true
|
|
|
+ },
|
|
|
+ lifetimes: {
|
|
|
+ ready() {
|
|
|
+ /* setTimeout(() => {
|
|
|
+ this.setData({
|
|
|
+ intoViewId: 'basic1'
|
|
|
+ })
|
|
|
+ }, 1000) */
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 组件的初始数据
|
|
|
+ */
|
|
|
+ data: {
|
|
|
+ result: ['a', 'b'],
|
|
|
+ leftIntoViewId: null,
|
|
|
+ rightIntoViewId: null,
|
|
|
+ heightList: [],
|
|
|
+ },
|
|
|
+
|
|
|
+ observers: {
|
|
|
+ 'list': function (list) {
|
|
|
+ if (!list.length) return;
|
|
|
+ if (this.data.intoViewId == null) this.setData({
|
|
|
+ leftIntoViewId: list[0].system + list[0].systemid,
|
|
|
+ rightIntoViewId: list[0].system + list[0].systemid
|
|
|
+ })
|
|
|
+ setTimeout(() => {
|
|
|
+ this.getAppsHeight(list);
|
|
|
+
|
|
|
+ }, 500)
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 组件的方法列表
|
|
|
+ */
|
|
|
+ methods: {
|
|
|
+ /* 点击左侧分类 */
|
|
|
+ changeType(e) {
|
|
|
+ this.setData({
|
|
|
+ leftIntoViewId: e.target.id,
|
|
|
+ rightIntoViewId: e.target.id
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getAppsHeight(list) {
|
|
|
+ let heightList = [];
|
|
|
+ for (let i = 0; i < list.length; i++) {
|
|
|
+ let cas = '.' + list[i].system + list[i].systemid;
|
|
|
+ let query = wx.createSelectorQuery().in(this).select(cas).boundingClientRect();
|
|
|
+ query.exec(res => {
|
|
|
+ if (!res[0]) return this.getAppsHeight(list);
|
|
|
+ heightList.push(res[0])
|
|
|
+ if (heightList.length == list.length) this.setData({
|
|
|
+ heightList
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ viewScroll({
|
|
|
+ detail
|
|
|
+ }) {
|
|
|
+ let arr = this.data.heightList, //获取元素信息
|
|
|
+ id = this.data.leftIntoViewId, //获取当前左侧栏选项
|
|
|
+ i = arr.findIndex(v => v.id == id), //选项当前在数组中的索引号
|
|
|
+ scrollTop = detail.scrollTop,
|
|
|
+ //判断当前索引是不是数组最后一条数据，不是的话拿下一个索引的距顶距离
|
|
|
+ top = (i + 1 == arr.length) ? arr[i].top - 15 - arr[i].height : arr[i + 1].top - 15 - arr[i + 1].height;
|
|
|
+ if (scrollTop >= top) {
|
|
|
+ if (!arr[i + 1]) return;
|
|
|
+ if (id == arr[i + 1].id) return;
|
|
|
+ this.setData({
|
|
|
+ leftIntoViewId: arr[i + 1].id
|
|
|
+ })
|
|
|
+ } else if (scrollTop < top) {
|
|
|
+ if (!arr[i - 1] || id == arr[0].id) return;
|
|
|
+ if (scrollTop < Math.abs((arr[i - 1].top - 15 - arr[i - 1].height) / 2)) this.setData({
|
|
|
+ leftIntoViewId: arr[i - 1].id
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ if (id == arr[1].id) return; //排除第一个
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+})
|
