scss通过js动态改变样式

这次项目使用scss去写样式。知道scss能写函数,嵌套能功能。现在我想希望通过js结合scss函数去动态。不再是以前那种在js页面判断一个值,然后再觉得样式怎么展示了。
打个比方:
image.png
以前的写法是:
js页面:

const [type,setType] = useState(false)
changeType = ()=>{setType(true)}

render(){
    return(
        <div onClick={changeType} className={type?"one":"two"}></div>
    )
}

css页面:

one:{color:red}
two:{color:blue}
回复
阅读 3k
1 个回答

SCSS 叫做 CSS 预处理器,其中的 SCSS 语法,函数也好,嵌套也好,处理完了后什么都没了,输出的就是合法的 CSS,浏览器加载后是分不出它是手写的还是经过预处理器的。

js 是在浏览器中运行的,所以它是没有办法和 SCSS 的函数配合工作的,他们运行的时机都不一样。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏