1、当面板内无嵌入子组件直接按照官网方式
<u-collapse ref="xxxxxx111">
<u-collapse-item name="basicInform" title="xxx">
<xxxxx></xxxx>
</u-collapse-item>
<u-collapse-item name="collectDetail" title="xxx">
<xxxxx></xxxxx>
</u-collapse-item>
</u-collapse>
函数中
this.$nextTick(() => {
this.$refs."xxxxxx111.init()
})
2、当嵌入子组件时情况比较复杂,安装上述方式会关闭子组件,如下方式即可
借助子组件给父组件传值事件里面加载高度
<u-collapse ref="test1" accordion :value="foldComponent">
<u-collapse-item name="tt1" >
<mytest title="测试"></mytest>
</u-collapse-item>
<u-collapse-item name="tt2" title="测试">
<mytest1 @loadHeight="loadHeight"></mytest1>
</u-collapse-item>
数据层
data() {
return {
foldComponent:"",//折叠组件
}
},
方法层
loadHeight(data) {
console.log("计算高度")
console.log(data)
if (data == 'computeHeight') {
this.foldComponent="tt2"
this.$nextTick(() => {
this.$refs.test1.init()
})
}
}