css加载不出来

 

起因：

        <el-table
            :data ="table"
            style="width: 100vw;text-align: left;"
            :row-class-name="tableRowClassName">
            <el-table-column
                prop="id"
                label="入库单号"
                width="133"></el-table-column>
            <el-table-column
                prop="name"
                label="库位名称"
                width="140"></el-table-column>
            <el-table-column
                prop="number"
                label="数量"
                width="70"></el-table-column>
        </el-table>

<style scoped>
    .el-table .a-row{
        background-color: #2C3E50;
    }
</style>

 

 

原因：css里面声明了scoped,每个组件的element会产生对应的属性，格式data-v-。

El-table标签创建了一个<table>表单，但使用row-class-name添加的表单是加在对应的index的tr标签上面的，没有对应的data-v,所以css加载不进来。

Scoped作用是实现作用域控制，通过增加命名空间，来使css局部作为。