如何在SASS中将字符串分成两个数字列表? [英] How to split a string into two lists of numbers in SASS?
本文介绍了如何在SASS中将字符串分成两个数字列表?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个SASS / SCSS字符串,其中包含两个列表(以逗号分隔),每个列表包含数字(以空格分隔)。我如何将字符串分成两个数字列表?
I have a SASS/SCSS string which contain two lists (separated by comma), and each list contain numbers (separated by space). How can i split string into two lists of numbers?
SCSS:
$values: "10px 20px 30px, 20px 30px 40px";
$begin: /* should be */ "10px", "20px", "30px";
$end: /* should be */ "20px", "30px", "40px";
// optionally it can be a map:
$begin: (10px, 20px, 30px);
$end: (20px, 30px, 40px);
Sass Meister上的代码:
http://sassmeister.com/gist/4d9c1bd741177636ae1b
Code on Sass Meister: http://sassmeister.com/gist/4d9c1bd741177636ae1b
推荐答案
好吧,您可以使用以下功能拆分字符串:
Well, you can split the string with this function:
@function str-split($string, $separator) {
// empty array/list
$split-arr: ();
// first index of separator in string
$index : str-index($string, $separator);
// loop through string
@while $index != null {
// get the substring from the first character to the separator
$item: str-slice($string, 1, $index - 1);
// push item to array
$split-arr: append($split-arr, $item);
// remove item and separator from string
$string: str-slice($string, $index + 1);
// find new index of separator
$index : str-index($string, $separator);
}
// add the remaining string to list (the last item)
$split-arr: append($split-arr, $string);
@return $split-arr;
}
在您的情况下,您可以这样使用:
In your case you could use it as so:
$values: "10px 20px 30px, 20px 30px 40px";
$list: ();
$split-values: str-split($values, ", ");
@each $value in $split-values {
$list: append($list, str-split($value, " "));
}
要将字符串值转换为数字,请查看 SassMeister (或阅读他的博客文章)
As for converting the string values to numbers, check out Hugo Giraudel's function on SassMeister (or read his blog post)
这篇关于如何在SASS中将字符串分成两个数字列表?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文