BH | |
---|---|
Type | skabelonmotor |
Udvikler | BEM Fællesskab |
Skrevet i | JS , PHP (officielle versioner) |
Operativ system | Cross-platform software |
Licens | MIT-licens |
Internet side | bem.github.io/bh |
BH ( B EM H TML ) er en kompileringsdeklarativ skabelonmotor til JS .
BH giver dig mulighed for at ændre noderne i DOM-træet på samme måde som CSS gør - i en deklarativ form.
At have en JS -erklæring :
bh . match ( 'knap' , funktion ( ctx ) { ctx . tag ( 'knap' ); }); bh . match ( 'button_legacy' , function ( ctx , json ) { ctx . tag ( 'input' ); ctx . attr ( 'type' , 'button' ); ctx . attr ( 'value' , json . content ); }) ; bh . match ( 'button_submit' , function ( ctx , json ) { ctx . tag ( 'input' ); ctx . attr ( 'type' , 'submit' ); ctx . attr ( 'value' , json . content ); }) ;Eller en lignende erklæring i PHP -syntaks :
$bh -> match ( 'knap' , funktion ( $ctx ) { $ctx -> tag ( 'knap' ); }); $bh -> match ( 'button_legacy' , function ( $ctx , $json ) { $ctx -> tag ( 'input' ); $ctx -> attr ( 'type' , 'button' ); $ctx -> attr ( 'værdi' , $json -> indhold ); }); $bh -> match ( 'button_submit' , funktion ( $ctx , $json ) { $ctx -> tag ( 'input' ); $ctx -> attr ( 'type' , 'submit' ); $ctx -> attr ( 'værdi' , $json -> indhold ); });Og inputdata:
[ { "block" : "button" , "content" : "Bare en knap" }, { "block" : "button" , "mods" : { "submit" : true }, "content" : "Send knap" } , { "block" : "button" , "mods" : { "legacy" : true }, "content" : "Legacy button" }, { "block" : "button" , "mods" : { "legacy " : true , "submit" : true }, "content" : "Send knap i gammel stil" } ]Vi får resultatet:
< button class = "button" > Bare en knap </ button > < input class = "button button_submit" type = "submit" value = "Send knap" /> < input class = "button button_legacy" type = "button" værdi = "Legacy-knap" /> < input class = "button button_legacy button_submit" type = "send" værdi = "gammel indsend-knap" />De officielle implementeringer af BH er skrevet i JavaScript og PHP .