u-collapse-item获取的高度不正确，导致折叠面板打开后内容显示不全

[FoXiMao]

<u-collapse event-type="close" @change="change" :item-style="itemStyle">
		<u-collapse-item   @change="itemChange" title="历史报账信息">
			<history-expense  :useType="1" :token="token.data" :linkId="form.linkId"></history-expense>
		</u-collapse-item>
</u-collapse>

主体代码如上 如果u-collapse-item中是一个没有指定高度的组件 那么u-collapse-item组件中的queryRect的方法获取的高度将是错误的

<view class="u-collapse-body" :style="[{
				height: isShow ? height + 'px' : '0'
				//height: isShow ?'auto' : '0'
			}]">
	<view class="u-collapse-content" :id="elId" :style="[bodyStyle]">
		<slot></slot>
        </view>
</view>

组件中是将u-collapse-body的高度写死的 这样会导致折叠面板打开后内容显示不全 我将固定高度改成了auto暂时解决了 这个问题 但是不知道会发生什么其他的bug

[haohaitao]

我也遇到了这个问题，出现的机率很高

[Amodoro]

<u-collapse event-type="close" @change="change" :item-style="itemStyle">
		<u-collapse-item   @change="itemChange" title="历史报账信息">
			<history-expense  :useType="1" :token="token.data" :linkId="form.linkId"></history-expense>
		</u-collapse-item>
</u-collapse>

主体代码如上 如果u-collapse-item中是一个没有指定高度的组件 那么u-collapse-item组件中的queryRect的方法获取的高度将是错误的

<view class="u-collapse-body" :style="[{
				height: isShow ? height + 'px' : '0'
				//height: isShow ?'auto' : '0'
			}]">
	<view class="u-collapse-content" :id="elId" :style="[bodyStyle]">
		<slot></slot>
        </view>
</view>

组件中是将u-collapse-body的高度写死的 这样会导致折叠面板打开后内容显示不全 我将固定高度改成了auto暂时解决了 这个问题 但是不知道会发生什么其他的bug

<u-collapse event-type="close" @change="change" :item-style="itemStyle">
		<u-collapse-item   @change="itemChange" title="历史报账信息">
			<history-expense  :useType="1" :token="token.data" :linkId="form.linkId"></history-expense>
		</u-collapse-item>
</u-collapse>

主体代码如上 如果u-collapse-item中是一个没有指定高度的组件 那么u-collapse-item组件中的queryRect的方法获取的高度将是错误的

<view class="u-collapse-body" :style="[{
				height: isShow ? height + 'px' : '0'
				//height: isShow ?'auto' : '0'
			}]">
	<view class="u-collapse-content" :id="elId" :style="[bodyStyle]">
		<slot></slot>
        </view>
</view>

组件中是将u-collapse-body的高度写死的 这样会导致折叠面板打开后内容显示不全 我将固定高度改成了auto暂时解决了 这个问题 但是不知道会发生什么其他的bug

不用修改源码，在外层加个v-if判断让它重新加载高度就会重新计算了，折叠面板这种不显示的情况只是在弹窗这种组件有问题

<u-popup v-model="industryTypeShow" mode="center" width="80%" border-radius="15" :closeable="true" :mask-close-able="false" class="industryType"> <view style="padding: 60rpx;" v-if="industryTypeShow"> <u-collapse> <u-collapse-item :title="item.head" v-for="(item, index) in itemList" :key="index"> {{item.body}} </u-collapse-item> </u-collapse> </view> </u-popup>

[FoXiMao]

<u-collapse event-type="close" @change="change" :item-style="itemStyle">
		<u-collapse-item   @change="itemChange" title="历史报账信息">
			<history-expense  :useType="1" :token="token.data" :linkId="form.linkId"></history-expense>
		</u-collapse-item>
</u-collapse>

主体代码如上 如果u-collapse-item中是一个没有指定高度的组件 那么u-collapse-item组件中的queryRect的方法获取的高度将是错误的

<view class="u-collapse-body" :style="[{
				height: isShow ? height + 'px' : '0'
				//height: isShow ?'auto' : '0'
			}]">
	<view class="u-collapse-content" :id="elId" :style="[bodyStyle]">
		<slot></slot>
        </view>
</view>

组件中是将u-collapse-body的高度写死的 这样会导致折叠面板打开后内容显示不全 我将固定高度改成了auto暂时解决了 这个问题 但是不知道会发生什么其他的bug

<u-collapse event-type="close" @change="change" :item-style="itemStyle">
		<u-collapse-item   @change="itemChange" title="历史报账信息">
			<history-expense  :useType="1" :token="token.data" :linkId="form.linkId"></history-expense>
		</u-collapse-item>
</u-collapse>

主体代码如上 如果u-collapse-item中是一个没有指定高度的组件 那么u-collapse-item组件中的queryRect的方法获取的高度将是错误的

<view class="u-collapse-body" :style="[{
				height: isShow ? height + 'px' : '0'
				//height: isShow ?'auto' : '0'
			}]">
	<view class="u-collapse-content" :id="elId" :style="[bodyStyle]">
		<slot></slot>
        </view>
</view>

组件中是将u-collapse-body的高度写死的 这样会导致折叠面板打开后内容显示不全 我将固定高度改成了auto暂时解决了 这个问题 但是不知道会发生什么其他的bug

不用修改源码，在外层加个v-if判断让它重新加载高度就会重新计算了，折叠面板这种不显示的情况只是在弹窗这种组件有问题

<u-popup v-model="industryTypeShow" mode="center" width="80%" border-radius="15" :closeable="true" :mask-close-able="false" class="industryType"> <view style="padding: 60rpx;" v-if="industryTypeShow"> <u-collapse> <u-collapse-item :title="item.head" v-for="(item, index) in itemList" :key="index"> {{item.body}} </u-collapse-item> </u-collapse> </view> </u-popup>

我没有放在弹窗组建里面，就是一个单独的折叠面板。 根据你的代码来看 可能是因为你在u-collapse-item中并没有放置一个没有指定高度的组件，所以没有复现， 具体可参照我贴的代码

[gg-guang]

我也遇到了这个问题，我是在里面又嵌套了一层u-collapse,外面那层的高度总是不正确，我修改源码height变为auto暂时解决了

[WuJinSong1]

我的是 margin-bottom 的高度出不来，换成padding就好了