bug

jiangping

2023-11-07 64b432916af9c9218ab3f3eca614e26c542142ae

 minipro_standard/uni_modules/uview-ui/components/u-index-item/u-index-item.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,87 @@
<template>
   <!-- #ifdef APP-NVUE -->
   <cell ref="u-index-item">
      <!-- #endif -->
      <view
         class="u-index-item"
         :id="`u-index-item-${id}`"
         :class="[`u-index-item-${id}`]"
      >
         <slot />
      </view>
      <!-- #ifdef APP-NVUE -->
   </cell>
   <!-- #endif -->
</template>

<script>
   import props from './props.js';
   // #ifdef APP-NVUE
   // ç”±äºŽweex为阿里的KPI业绩考核的产物，所以不支持百分比单位，这里需要通过dom查询组件的宽度
   const dom = uni.requireNativePlugin('dom')
   // #endif
   /**
    * IndexItem 
    * @description 
    * @tutorial https://uviewui.com/components/indexList.html
    * @property {String}
    * @event {Function}
    * @example
    */
   export default {
      name: 'u-index-item',
      mixins: [uni.$u.mpMixin, uni.$u.mixin,props],
      data() {
         return {
            // æœ¬ç»„件到滚动条顶部的距离
            top: 0,
            height: 0,
            id: ''
         }
      },
      created() {
         // å­ç»„件u-index-anchor的实例
         this.anchor = {}
      },
      mounted() {
         this.init()
      },
      methods: {
         init() {
            // æ­¤å¤„会活动父组件实例，并赋值给实例的parent属性
            this.getParentData('u-index-list')
            if (!this.parent) {
               return uni.$u.error('u-index-item必须要搭配u-index-list组件使用')
            }
            uni.$u.sleep().then(() =>{
               this.getIndexItemRect().then(size => {
                  // ç”±äºŽå¯¹è±¡çš„引用特性，此处会同时生效到父组件的children数组的本实例的top属性中，供父组件判断读取
                  this.top = Math.ceil(size.top)
                  this.height = Math.ceil(size.height)
               })
            })
         },
         getIndexItemRect() {
            return new Promise(resolve => {
               // #ifndef APP-NVUE
               this.$uGetRect('.u-index-item').then(size => {
                  resolve(size)
               })
               // #endif

               // #ifdef APP-NVUE
               const ref = this.$refs['u-index-item']
               dom.getComponentRect(ref, res => {
                  resolve(res.size)
               })
               // #endif
            }) 
         }
      },
   }
</script>

<style lang="scss" scoped>
   @import "../../libs/css/components.scss";
	
</style>