LESS.js + @arguments + 1つの引数をスキップ

Question

Googleなどで検索していますが、私が探していたものを見つけることができませんでした（私は何か見落としていないことを願っています）。皆さん:)

私はLESS-JSで初めて遊んでいます。私は本当に好きです。しかし、私は今少し問題があります。

私はこのような@arguments変数を使用しています：期待どおりに動作

.basicBorder(@width:1px, @type:solid, @color:@black){ 
    border:@arguments; 
} 

を。

.basicBorder(1px, solid, @red); 

期待通りにも動作します：私は境界線が赤になりたいとき今、私は私のCSSの要素にこれを追加しています。しかし、これらはすでに私のデフォルト値ですので、私は、1px, solid,を書き込まないようしたいと思いますが、私はこのしようとすると：

.basicBorder(@red); 

またはこの：

.basicBorder(,,@red); 

をそれは仕事をdoesntの。

私はどのように私はちょうど私が境界線の幅とタイプを変更したい場合は、色を入力することができますので、最初の2変数を "スキップ"することができるかどうか知っていたのだろうか。

私はあなたが何を言おうとしていることを願っています！

よろしくお願いいたします。

Answer 1

LESSのパラメトリックミックスインは、JavaScript関数のように機能します。最初のパラメータはスキップできません。だから、あなただけの色を変更したい場合、あなたはこのようにミックスインを書き換えることができます：

.basicBorder(@red); 
.basicBorder(@red, 2px, dotted); 

編集
使用：

.basicBorder(@color:@black, @width:1px, @type:solid){ 
    border:@width @type @color; 
} 

を次に、あなたがこのようにそれを呼び出すことができると思いますオリジナルのミックスインを作成することもできます。

.basicBorderType(@type) { 
    .basicBorder(1px, @type, @black); 
} 
.basicBorderColor(@color) { 
    .basicBorder(1px, solid, @color); 
} 

これでいずれのスタイルも上書きできます：

.basicBorderType(dotted); //1px dotted black; 
.basicBorderColor(@red); //1px solid red; 
.basicBorder(2px);  //2px solid black; 

ハックのビットを、それはあなたを助けるために私は考えることができる唯一のことだ...

Answer 2

あなたが実際に後でパラメータに名前を付け、最初のものをスキップすることができます。あなたの質問のための構文は次のとおりです。

.basicBorder(@color:@red); 

あなたはまた、最初に通常の注文引数を使用し、残りのパラメータから名前付き引数を摘み取ることができます。

.basicBorder(2px, @color:@red); 

これは2pxに@width、@typeを設定し、デフォルト値は@color〜@redです。あなたがめったに引数を使用しない場合、本当にいいです。