在less中书写的样式失效

在less文件中写了一个样式，让一个div中的所有div都呈现position： absolute

.filterCol {
    & > div {
        position: absolute;
       
    }
}

可是在网页里这个样式完全失效

问了师傅，发现是在className的书写格式上出现问题

 

 

原本写的className格式：

<div  className="filterCol">

应该改成:

<div  className={styles['filterCol']}>

 

之前定义了，所以上面写成这样

import styles from '../css/filterColumn.less'

 

 

将styles打印出来，可以看到

并且在控制台上可以看到

 

自动会给filterColumn分配一个新的名字，出错的时候我没有写成styles的格式，就不会给它赋名字，匹配不到故样式失效