即使添加了類，也不會應用 Scss/sass 樣式

Question

我有一個函數可以添加單擊時active的類。

問題是我可以看到在inspect瀏覽器時單擊時添加的類，但沒有應用實際的樣式。

請參閱下面的代碼

HTML

<div class="header">
</div>
<div class="modal-wrapper">                     
</div>

查詢

$(".header").on("click", function (){
    const wrapper = $(".modal-wrapper");
    wrapper.addClass(".active");
});

SCSS

.modal-wrapper{
    &.active{
        width: 100%;
        height: 100%; 
        position: fixed; 
        background-color: #444; 
        top: 0; 
        left:0; 
        z-index:4444;
    }
}

Answer 1

您的代碼中存在小的語法錯誤，請刪除 . 來自 cals“活動”類名

wrapper.addClass(".active");

變成

wrapper.addClass("active");

工作 Js 小提琴： https : //jsfiddle.net/katheer_mizal/qb4zwa1k/3/