码迷,mamicode.com
首页 > 编程语言 > 详细

[SCSS] Convert SCSS Variable Arguments to JavaScript

时间:2018-04-24 17:29:42      阅读:200      评论:0      收藏:0      [点我收藏+]

标签:ado   convert   ons   span   shadows   int   log   sas   button   

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

 

[SCSS] Convert SCSS Variable Arguments to JavaScript

标签:ado   convert   ons   span   shadows   int   log   sas   button   

原文地址:https://www.cnblogs.com/Answer1215/p/8930987.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!