将心比心,方得人心~

使用$nextTick渲染后获取渲染数据的高度

周洲 2018-06-20 20:24:04

html 部分:

<div v-for="item in resume.skill" class="right-content col-md-12 pull-right">
	<div class="skill-top-box">
		<div class="skill-name pull-left"><strong>{{item.name}}</strong></div>
		<div class="skill-evaluate pull-right">{{item.name}}</div>
	</div>
	<div class="clearfix"></div>
	<div class="progress" style="height:10px;margin-top:15px;">
		<div class="progress-bar progress-bar-success" role="progressbar"
			 aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
			 :style="{width:item.schedule}">
		</div>
	</div>
</div>

js部分:

请求数据成功后添加:

this.$nextTick(() => {
	for(var i=0;i<$('.vertical-line').length;i++) {
		var rightContentHeight = $('.right-content-box').eq(i).height();
		$('.vertical-line').eq(i).height(rightContentHeight - 50);
	}
})

打赏

『微信打赏』

Tag标签$nextTick 

我是有底线的