LESS - 補間 - 動的に生成されたクラス名をMIXIN自体として使用しますか？

Question

パラメータを受け入れるmixinを使い、そのパラメータを使用して別のmixinを呼び出すとします。

.text-right { 
    text-align: right 
} 

.text-center { 
    text-align: center; 
} 

.text-left { 
    text-align: left; 
} 


// mixin to call one of the above selectors 
.text-align(@direction) { 
    .text-@{direction}; 
} 

body { 
    .text-align(right); 
} 

// Unrecognized input on this line 
// .text-@{direction}; 

これを試みると、パラメータを補間しようとする行に認識できない入力が表示されます。

どのようにパラメータを受け入れ、[（パラメータ名は、ミックスインの名前の一部である）別のミックスインを呼び出すようにそのパラメータを使用できますか？

Answer 1

できません。そうではありません。 LESSソースコード内の該当する行はparser.js、mixin.callである - ミックスインコールのパーサ：

e = parserInput.$re(/^[#.](?:[\w-]|\\(?:[A-Fa-f0-9]{1,6} ?|[^A-Fa-f0-9]))+/) 

有効なミックスインコールが唯一の有効なCSSの.classファイルまたは#ID識別子として命名することができる、です。他のすべては解析不能であり、変数補間段階に至らない。

ソリューションの要件を緩和すれば、方法があります。ここで、クラス名の一部を取り、そのクラス名でミックスインを呼び出す関数が必要です。それは完全にダイナミックされていないと一緒に暮らすことができれば、我々は単にwhen句の数とその機能を実装できます。

.text-align(@direction) when (@direction=left) { 
    .text-left; 
} 
.text-align(@direction) when (@direction=center) { 
    .text-center; 
} 
.text-align(@direction) when (@direction=right) { 
    .text-right; 
}