<template>
Transformer
Weex
Features
- convert a
<template>
element to JSON-like object - autofix common mistakes & friendly warnings
- tag name
- attr
- text content
- parse data binding and expressions
- make sure only one root node
API
parse(code, done)
validate(json, done)
/** * Parse `<template>` code to a JSON-like Object and log errors & warnings * * @param * @param */ {} /** * Validate a JSON-like Object and log errors & warnings * * @param * @param */ {} /** * Result callback * * data * - jsonTemplate{type, attr, style, events, shown, repeat} * - deps[tagname] * - log[{line, column, reason}] * * @param * @param */ {}
Validation
- root check: only one root element (ignore others)
- tagname check: native or hyphenated (autofix or warn non-hyphenated custom tagname)
- child/parent check: elements required certain child/parent (error)
- attr value check: special tag[attr] value (error or autofix or warn)
- text content check: only text element allows text content (error)
- data binding check:
- normal value (exp converting)
- event: non-mustache -> mustache (autofix)
- style:
k: {{v}}; ...
(styler.validate
needed) - class:
a {{v}} c
Demo
var templater = var code = '<template><container><text>Hello</text><img class="a {{x}} c" src="{{y}}" /><image style="opacity: {{z}}"></image></container></template>' templater var json = type: 'container' children: type: 'text' value: 'Hello' type: 'image' class: 'a {{x}} c' attr: src: '{{y}}' type: 'img' style: opacity: '{{z}}'