DataV框架中，边框dv-border-box-初始化时不显示，只有页面尺寸变化时才显示

最新推荐文章于 2024-06-12 16:52:54 发布

七七码生

最新推荐文章于 2024-06-12 16:52:54 发布

阅读量1.8k

点赞数 1

分类专栏：遇到的问题文章标签：前端 javascript html

本文链接：https://blog.csdn.net/weixin_46329670/article/details/130290283

版权

遇到的问题专栏收录该内容

14 篇文章 0 订阅

订阅专栏

官网已经有解释
http://datav.jiaminghi.com/guide/#%E7%94%A8%E5%89%8D%E5%BF%85%E7%9C%8B
在这里插入图片描述

宽高异常

组件的默认宽高都是100%，可以根据父容器宽高进行自适应，但在某些情况下组件宽高可能表现异常，这种情况一般是因为组件的父容器宽高发生了变化，而组件没有侦知这一变化，你可以在组件上绑定key值，在更改父容器宽高且页面完成重绘后（使用$nextTick），更新key值，使组件强制刷新，以获取正确宽高。

代码实现

/** html代码 */
<dv-border-box-9 :key="updateKey">
</dv-border-box-9>

/** script代码 */
export default {
    name: 'TurnelInfo',
    data() {
        return {
            updateKey: 1,
            }
     }
}

在页面需要显示的时候使用this.$nextTick()将key变化一下即可
this.$nextTick(()=> {
    this.updateKey +=1
})