45

I know you can strip units from numbers in SASS when you know the unit before-hand like this:

$number: 16px;
$without-unit: 16px / 1px;
@warn $without-unit; // 16

But is it possible to strip the unit from a number without knowing what the unit is first?

@function strip-unit($number) {
  // magic code here...
}

@warn strip-unit(16px); // 16
4

3 に答える 3

117

-

更新:実際にこの関数を使用する必要はありません。Sassの数学は単位について非常に賢く、必要なものを取得するために正しい数学を使用するよりも、単位を取り除くことがより良いオプションであるというユースケースを見たことがありません。これについて詳しく説明されているSassの問題スレッドを参照してください。

これは賢い関数ですが、使いたくなった場合は、数学に問題がある可能性があります。この機能に頼らないでください。代わりにあなたの数学を修正してください。

-

同じ単位の1で割る必要があります。を使用するunit()と、数値の代わりに文字列が得られますが、ゼロを掛けて1を足すと、必要なものが得られます。

@function strip-units($number) {
  @return $number / ($number * 0 + 1);
}

更新:Sassの最新バージョンでは、次のようになります。

@use 'sass:math';

@function strip-units($number) {
  @return math.div($number, ($number * 0 + 1));
}

それはうまくいきます。strip-units(13.48cm)を返し13.48ます。

于 2012-09-09T01:27:54.380 に答える
0

ユニットを削除するには、カスタムRuby関数を追加する必要があると思います(カスタム関数の追加に関するドキュメントを参照してください)。それはこのように見えるでしょう、私は思います(警告、テストされていません):

module Sass::Script::Functions
  def strip_units(num)
    assert_type num, :Number
    Sass::Script::Number.new(num.value)
  end
end
于 2012-09-08T22:12:52.943 に答える
0

ストリップユニットSASS関数の唯一の使用例は、単位変換関数を作成する場合です。PXをEM/REMに、またはその逆に変換するタスクにのみ役立つことがわかりました。

同じ単位の1で割る必要があります。unit()を使用すると、数値の代わりに文字列が得られますが、ゼロを掛けて1を足すと、必要なものが得られます-ミリアム・スザンヌ

SASSコンパイラはPHPインタプリタと非常によく似た値を処理すると思います(ただし警告があります)ので、上記のステートメントは正しくないと思います。文字列(たとえば、数値で始まる'16px')を数値(または数値で始まる文字列値)で除算または乗算すると、コンパイラが操作を実行できるように、文字列が数値に変換されます。

文字列を数値に追加する場合も同様で、数値を文字列に変換します。

次の解決策は、この戦術を正しく適用します。

@function strip-unit($value) {
  @return $value / 1;
}
于 2021-02-12T11:27:18.983 に答える