[SCSS] Convert SCSS Variable Arguments to JavaScript
JavaScript to variable convert arguments Scss
2023-09-14 09:00:50 时间
We will learn how to convert variable arguments by using rest operator in JavaScript.
.sass-btn { color: #fff; background-color: #0069d9; margin: 5px; @include button-size(); @include box-shadow(0px 4px 5px #666, 2px 6px 10px #999); } @mixin box-shadow($shadows...) { -moz-box-shadow: $shadows; -webkit-box-shadow: $shadows; box-shadow: $shadows; }
Scss "$shadows..." the same as "...shadows" in Javascript.
export const boxShadow = (...shadows) => ` -moz-box-shadow: ${shadows}; -webkit-box-shadow: ${shadows}; box-shadow: ${shadows}; `
interesting thing is ...shadows in Javascript is an Array, but if we put into ${}, then it conver to a string:
const shadows = ['red', 'blue']; console.log(`${shadows}`); // red, blue
相关文章
- javascript 基础_JavaScript高级编程
- javascript_JavaScript走向成熟
- 【说站】Javascript有哪些Math数学类
- ORA-16444: ALTER SYSTEM FLUSH REDO TO STANDBY failed due to a corrupted control file or online log file. ORACLE 报错 故障修复 远程处理
- JavaScript学习总结(十六)——Javascript闭包(Closure)详解编程语言
- JavaScript学习总结(九)——Javascript面向(基于)对象编程详解编程语言
- ECC TO HANA FAGLB03 search-help on Account Number field doesn’t working or not returning the selected value to the Account Number field.详解编程语言
- 利用Oracle TO函数实现数据转换(oracle to_函数)
- 用javascript实现代替marquee的滚动字幕效果代码
- Javascript常用运算符(Operators)-javascript基础教程
- Javascript更新JavaScript数组的uniq方法
- javascript背投广告代码的完善
- FF和IE之间7个JavaScript的差异
- JavaScript验证浏览器是否支持javascript的方法小结
- javascript将ip地址第四段用星号代替的两种方法
- Javascript异步加载详解(浏览器在javascript的加载方式)
- javascript常用对话框小集
- javascript常用函数归纳整理
- Javascript堆排序算法详解
- JavaScript版的TwoQueues缓存模型
- Javascript基础教程之JavaScript语法
- 用javascript关闭本窗口不弹出询问框的方法