4

Есть строка "14рх", как привести ее к числу в SCSS?
К примеру для строкового представления значения есть функция inspect($value), для того, что бы узнать единицы связанные с числом есть unit($number). Но как быть если type-of(14рх) возвращает string, а нужно namber.
Поясняю: есть такой код, который смотрит есть ли у значения списка единицы измерения и если нет, то дописывает

@function chekList($list) {
    $tmp: ();
    @each $key in $list {
        @if(unitless($key)) {
            $key: inspect($key);
            $key: str-insert($key, "px", str-length($key) + 1);
        }
        $tmp: append($tmp, $key);  
    }
    @return $tmp; 
}

Теперь бы еще конвертнуть полученные строковые значения в числовые....
Или посоветуйте как дописать единицы к числу, если их нет?

P.S. Ниже я дал ответ как можно добавить единицы измерения, если их нет. Но все же интересует как можно конвертировать строку в число.
Допустим 10 + "px" на выходе даст строку "10рх", а нужно, что бы это было число.

2

2 ответа 2

3

Вдруг кому-то пригодиться. Я не нашел функции преобразования строки в число, но что-бы добавить единицы измерения к числу, если их нет, можно просто умножить это число на единицу с нужными единицами измерения.

@if(unitless($key)) {
   $key: $key * 1px;
} 
1

Прочитав статью, ссылку на которую дал soledar10 я не стал дублировать полностью функцию предоставленную там, для моих целей она нужна не полностью, а лишь та часть, где к числу добавляются единицы измерения.
Немного модифицировав код из предыдущего ответа получилось вот что:

@function chekUnit($list) {
    $strings: 'px' 'cm' 'mm' '%' 'ch' 'pica' 'in' 'em' 'rem' 'pt' 'pc' 'ex' 'vw' 'vh' 'vmin' 'vmax';
    $units:   1px  1cm  1mm  1%  1ch  1pica  1in  1em  1rem  1pt  1pc  1ex  1vw  1vh  1vmin  1vmax;
    $tmp: ();
    @each $key in $list {
        @if(unitless($key)) {
            $index: index($strings, $list-unit);
            @if not $index {
                @error "Unknown unit `#{$list-unit}`.";
            }
            $key: $key * nth($units, $index);
        }
        $tmp: append($tmp, $key);  
    }
    @return $tmp; 
}

Где $list-unit - это переменная с задаваемыми единицами в настройках проекта.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.