如何设置css判断class元素数据为空的时候显示‘--’

:empty是一个css的伪类选择器，用于选择页面中为空的元素,作用于该元素，使用 empty 配合 bofore 或者 after 可以打到空元素占位的效果，

如何实现呢

<div class="real_highlight real_highlight_name ellipsis empty_ph"  v-html="row.companyName"></div>

empty_ph css样式

//空元素展示占位符 empty_placeholder
    .empty_ph{
        &:empty{
            pointer-events: none;
        }
        &:empty:after{
            color: rgba(0, 0, 0, 0.8);;
            content: '--';
        }
    }

当后端数据返回接口里面为空 要进行处理成‘–’
这样是最简单的办法了