Wie generiere ich eine Übergangsregel in Stylus

Question

Ich versuche, eine generische Übergangsregel in Stylus zu tun. Meine Funktion arbeitet nur speziell. Es gibt mir eine Zeichenfolge 'alle Leichtigkeit-in-out 0.2s' keine Regel und es funktioniert nicht in einem Browser, weil es in einfachen Anführungszeichen ist.

Ist es möglich, eine reine CSS-Regel zurückzugeben? Danke für jede Hilfe.

getTransition(affect = 'all', animationRule = 'ease-in-out', time = 0.2) 
    return affect + " " + animationRule + " " + unit(time, 's') 

Anruf

transition: getTransition('opacity') 

Ergebnis

transition: 'opacity ease-in-out 0.2s'; 

Answer 1

die Anführungszeichen in dem Parameter entfernen, wenn Sie die Funktion aufrufen:

Stylus

getTransition(affect = 'all', animationRule = 'ease-in-out', time = 0.2) 
    return affect + " " + animationRule + " " + unit(time, 's') 

div 
    transition: getTransition(opacity) 

CSS

div { 
    transition: opacity ease-in-out 0.2s; 
}