feat: support fake tag template, closes #10, closes Javey/Intact#4

Javey · Aug 8, 2018 · 50d9753 · 50d9753
1 parent 08b4a91
commit 50d9753
Show file tree

Hide file tree

Showing 6 changed files with 54 additions and 3 deletions.
diff --git a/dist/index.js b/dist/index.js
@@ -257,7 +257,8 @@ var Type$1 = {
     JSXBlock: i++,
     JSXComment: i++,
 
-    JSXDirective: i++
+    JSXDirective: i++,
+    JSXTemplate: i++
 };
 var TypeName$1 = [];
 for (var type in Type$1) {
@@ -767,6 +768,11 @@ Parser.prototype = {
 
         ret.value = this.source.slice(start, this.index);
 
+        // if (ret.value === 'template') {
+        // ret.type = Type.JSXTemplate;
+        // ret.typeName = TypeName[ret.type];
+        // }
+
         return this._parseAttributeAndChildren(ret, prev, position);
     },
 
@@ -1274,6 +1280,8 @@ Stringifier.prototype = {
                 return this._visitJSXVdt(element, isRoot);
             case Type$2.JSXComment:
                 return this._visitJSXComment(element);
+            case Type$2.JSXTemplate:
+                return this._visitJSXTemplate(element);
             default:
                 return 'null';
         }
@@ -1298,6 +1306,9 @@ Stringifier.prototype = {
                 });
                 element.children = [];
             }
+        } else if (element.value === 'template') {
+            var ret = this._visitJSXChildren(element.children);
+            return this._visitJSXDirective(element, ret);
         }
 
         var attributes = this._visitJSXAttribute(element, true, true);

diff --git a/dist/vdt.js b/dist/vdt.js
@@ -257,7 +257,8 @@ var Type$1 = {
     JSXBlock: i++,
     JSXComment: i++,
 
-    JSXDirective: i++
+    JSXDirective: i++,
+    JSXTemplate: i++
 };
 var TypeName$1 = [];
 for (var type in Type$1) {
@@ -769,6 +770,11 @@ Parser.prototype = {
 
         ret.value = this.source.slice(start, this.index);
 
+        // if (ret.value === 'template') {
+        // ret.type = Type.JSXTemplate;
+        // ret.typeName = TypeName[ret.type];
+        // }
+
         return this._parseAttributeAndChildren(ret, prev, position);
     },
 
@@ -1274,6 +1280,8 @@ Stringifier.prototype = {
                 return this._visitJSXVdt(element, isRoot);
             case Type$2.JSXComment:
                 return this._visitJSXComment(element);
+            case Type$2.JSXTemplate:
+                return this._visitJSXTemplate(element);
             default:
                 return 'null';
         }
@@ -1298,6 +1306,9 @@ Stringifier.prototype = {
                 });
                 element.children = [];
             }
+        } else if (element.value === 'template') {
+            var ret = this._visitJSXChildren(element.children);
+            return this._visitJSXDirective(element, ret);
         }
 
         var attributes = this._visitJSXAttribute(element, true, true);

diff --git a/dist/vdt.min.js b/dist/vdt.min.js
diff --git a/src/lib/stringifier.js b/src/lib/stringifier.js
@@ -100,6 +100,8 @@ Stringifier.prototype = {
                 return this._visitJSXVdt(element, isRoot);
             case Type.JSXComment:
                 return this._visitJSXComment(element);
+            case Type.JSXTemplate:
+                return this._visitJSXTemplate(element);
             default:
                 return 'null';
         }
@@ -126,6 +128,9 @@ Stringifier.prototype = {
                 });
                 element.children = [];
             }
+        } else if (element.value === 'template') {
+            // <template> is a fake tag, we only need handle its children and itself directives
+            return this._visitJSXDirective(element, this._visitJSXChildren(element.children));
         }
 
         var attributes = this._visitJSXAttribute(element, true, true);

diff --git a/src/lib/utils.js b/src/lib/utils.js
@@ -30,6 +30,7 @@ export const Type = {
     JSXComment: i++,
 
     JSXDirective: i++,
+    JSXTemplate: i++,
 };
 export const TypeName = [];
 for (let type in Type) {

diff --git a/test/vdt.coffee b/test/vdt.coffee
@@ -788,3 +788,26 @@ describe 'Vdt', ->
         Vdt.stringifier.stringify(Vdt.parser.parse(source)).should.eql """
         return h(Input, {'v-model': 'a', 'children': null, '_context': $this, value: _getModel(self, 'a'), 'ev-$change:value': [function() {try {return [b][0]} catch(e) {_e(e)}}.call($this),function(__c, __n) { _setModel(self, 'a', __n, $this) }]})
         """
+
+    it 'render template', ->
+        source = """
+        <div>
+            <template v-if={a}>
+                <div>1</div>
+                <div>2</div>
+            </template>
+            <template v-else>
+                <div>3</div>
+                <div>4</div>
+            </template>
+        </div>
+        """
+
+        render(source, {a: 1}).should.eql """
+        <div>
+    
+                <div>1</div>
+                <div>2</div>
+            
+        </div>
+        """