Я использую LESS CSS и уже использую функциональность 'return'.
.get-theme-color(@theme) {
@return: ~"@{mdc-theme-@{theme}}";
}
И использую его для присвоения значений следующим образом:
@var: .get-theme-color(primary)[];
Однако я пытаюсьвернуть значение выборочно, используя миксин.Я пробовал различные форматы - это то, что я сейчас пытаюсь сделать работу - безуспешно:
.get-property-box(@mask) when (length(@mask) >= 1) and (length(@mask) =< 4) {
@mask-len: length(@mask);
@val1: extract(@mask, 1);
@value: ~"@{val1}";
& when (@mask-len = 2) {
@val2: extract(@mask, 2);
@value: ~"@{val1} @{val2}";
}
& when (@mask-len = 3) {
@val2: extract(@mask, 2);
@val3: extract(@mask, 3);
@value: ~"@{val1} @{val2} @{val3}";
}
& when (@mask-len = 4) {
@val2: extract(@mask, 2);
@val3: extract(@mask, 3);
@val4: extract(@mask, 4);
@value: ~"@{val1} @{val2} @{val3} @{val4}";
}
@return: @value;
}
Вот альтернативная версия:
.get-property-box(@mask) when (length(@mask) >= 1) and (length(@mask) =< 4) {
@mask-len: length(@mask);
@val1: extract(@mask, 1);
@return: ~"@{val1}";
& when (@mask-len = 2) {
@val2: extract(@mask, 2);
@return: ~"@{val1} @{val2}";
}
& when (@mask-len = 3) {
@val2: extract(@mask, 2);
@val3: extract(@mask, 3);
@return: ~"@{val1} @{val2} @{val3}";
}
& when (@mask-len = 4) {
@val2: extract(@mask, 2);
@val3: extract(@mask, 3);
@val4: extract(@mask, 4);
@return: ~"@{val1} @{val2} @{val3} @{val4}";
}
}
И назовите это какэто:
.mdc-shape(round) {
@mask: 4rem, 5rem;
border-radius: .get-property-box(@mask)[];
}
Вывод:
border-radius: 4rem;
Я знаю, что охранники работают правильно (соответствующий раздел достигнут), но возвращаемое значение не обновляется.
Кто-нибудь получил совет о том, как я могу сделать эту работу?