استخدام المتغيرات في أسماء الخصائص في LESS (الخصائص الديناميكية / استيفاء اسم الخاصية)

لا يدعم LESS حاليًا الخصائص المدرجة ديناميكيًا، على الرغم من بعض المناقشات حول هذا الموضوع Stack Overflow.

الحل رقم 1: إدخال الخصائص التي تم إنشاؤها ديناميكيًا في قيمة الخاصية

هذا الحل البديل يُدخل الخصائص التي تم إنشاؤها ديناميكيًا في قيمة خاصية مرمزة:

.vendors(@property, @value, @pre: ect) {
  -inj:~"@{pre}; -webkit-@{property}: @{value}; -moz-@{property}: @{value}; -ms-@{property}: @{value}; -o-@{property}: @{value}; @{property}: @{value}";
}

الحل رقم 2: إدخال الخصائص التي تم إنشاؤها ديناميكيًا في اسم الفئة التالية (أقل

يقوم هذا الحل البديل بإنشاء فئة افتراضية أو مجموعة قواعد يتضمن البائعين ويبني الفئة التالية بشكل متكرر:

.vendors(@property, @value, @rest:"") {
  @inject:~"@{rest} -webkit-@{property}: @{value}; -moz-@{property}: @{value}; -ms-@{property}: @{value}; -o-@{property}: @{value}; @{property}: @{value};";
}

.test(@nextclass){
  .vendors(transform, "matrix(2,0,0,2,20,20)");
  .vendors(transform-origin,"10px 10px", @inject);
  (~"{@{inject}} .@{nextclass}"){/*next class properties*/};
}

الحل رقم 3: إدخال الخصائص التي تم إنشاؤها ديناميكيًا في اسم الفئة التالية (LESS 1.4.0 )

يستخدم هذا الإصدار التكرار للتغلب على القيود في LESS 1.4 .0:

@nl: `"\n\t"`;

.multi(@props,@vals,@i,@inj) {
  @property: extract(@props, 1);
  @value: extract(@vals, 1);
  @inject:~"@{inj}@{nl}-webkit-@{property}: @{value};@{nl}-moz-@{property}: @{value};@{nl}-ms-@{property}: @{value};@{nl}-o-@{property}: @{value};@{nl}@{property}: @{value};";
}

.multi(@props,@vals,@i,@inj:"") when (@i > 0) {
  @property: extract(@props, @i);
  @value: extract(@vals, @i);
  @injnext:~"@{inj}@{nl}-webkit-@{property}: @{value};@{nl}-moz-@{property}: @{value};@{nl}-ms-@{property}: @{value};@{nl}-o-@{property}: @{value};@{nl}@{property}: @{value};";
  .multi(@props,@vals,(@i - 1),@injnext);
}

في إصدارات LESS 1.6 والإصدارات الأحدث، يتم تنفيذ استيفاء اسم الخاصية محليًا، لذلك لا توجد حاجة إلى حلول بديلة.