通過JS設置MUI中Switch開關的狀態

MUI官方文檔中只說了toggle()函數可以切換開關的狀態,並未提及如何通過js直接設置開關的初始狀態。實際上開關是否開啓,是通過開關div上的mui-active樣式類來控制的,即如果有這個樣式類則開關處於打開狀態,否則爲關閉。於是可以通過JS維護classList即可,HTML代碼如下:

<div class="mui-switch mui-switch-blue mui-switch-mini" id="vibrationSwitch">
    <div class="mui-switch-handle"></div>
</div>

JS代碼如下:

if (isSwitchOn)
{
    document.getElementById("vibrationSwitch").classList.add('mui-active');
}
else
{
    document.getElementById("vibrationSwitch").classList.remove('mui-active');
}

話說,MUI官方文檔總是感覺不那麼細緻,遇到官方文檔中未提及的情況時,我們只能自己去多加分析和嘗試了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章