feat(compile): supports compiling v-if to the weex native directive

Author: Hanks10100

flow/compiler.js

@@ -76,8 +76,8 @@ declare type ASTNode = ASTElement | ASTText | ASTExpression;
 declare type ASTElement = {
   type: 1;
   tag: string;
-  attrsList: Array<{ name: string; value: string }>;
-  attrsMap: { [key: string]: string | null };
+  attrsList: Array<{ name: string; value: any }>;
+  attrsMap: { [key: string]: any };
   parent: ASTElement | void;
   children: Array<ASTNode>;
 
@@ -90,7 +90,7 @@ declare type ASTElement = {
   hasBindings?: boolean;
 
   text?: string;
-  attrs?: Array<{ name: string; value: string }>;
+  attrs?: Array<{ name: string; value: any }>;
   props?: Array<{ name: string; value: string }>;
   plain?: boolean;
   pre?: true;

src/platforms/weex/compiler/modules/recycle-list/index.js

@@ -2,6 +2,7 @@
 
 import { transformText } from './text'
 import { transformVBind } from './v-bind'
+import { transformVIf } from './v-if'
 
 let currentRecycleList = null
 
@@ -14,6 +15,8 @@ function preTransformNode (el: ASTElement) {
 function transformNode (el: ASTElement) {
   if (currentRecycleList) {
     // TODO
+    transformVIf(el)
+    transformVBind(el)
   }
 }
 
@@ -23,7 +26,6 @@ function postTransformNode (el: ASTElement) {
     if (el.tag === 'text') {
       transformText(el)
     }
-    transformVBind(el)
   }
   if (el === currentRecycleList) {
     currentRecycleList = null

src/platforms/weex/compiler/modules/recycle-list/v-bind.js

@@ -1,31 +1,26 @@
 /* @flow */
 
+import { camelize } from 'shared/util'
 import { getAndRemoveAttr, addAttr } from 'compiler/helpers'
 
-function isBindingAttr (name) {
+function isBindingAttr (name: string): boolean {
   return /^(v\-bind)?\:/.test(name)
 }
 
-function parseRealName (name: string): string {
-  return name.replace(/^(v\-bind)?\:/, '')
+function parseAttrName (name: string): string {
+  return camelize(name.replace(/^(v\-bind)?\:/, ''))
 }
 
 export function transformVBind (el: ASTElement) {
-  if (!el.attrsList.length) {
+  if (!el.attrsList || !el.attrsList.length) {
     return
   }
   el.attrsList.forEach(attr => {
-    // console.log('is binding attr:', attr.name, isBindingAttr(attr.name))
     if (isBindingAttr(attr.name)) {
-      const realName: string = parseRealName(attr.name)
+      const name: string = parseAttrName(attr.name)
       const binding = getAndRemoveAttr(el, attr.name)
-      if (el.attrs) {
-        el.attrs = el.attrs.filter(at => at.name !== realName) // omit duplicated
-      }
-      getAndRemoveAttr(el, realName)
-      addAttr(el, realName, { '@binding': binding })
+      addAttr(el, name, { '@binding': binding })
     }
   })
   el.hasBindings = false
-  // el.plain = true
 }

src/platforms/weex/compiler/modules/recycle-list/v-if.js

@@ -0,0 +1,29 @@
+/* @flow */
+
+import { getAndRemoveAttr, addAttr } from 'compiler/helpers'
+
+function isConditionAttr (name: string): boolean {
+  return /^v\-if|v\-else|v\-else\-if/.test(name)
+}
+
+export function transformVIf (el: ASTElement) {
+  for (const attr in el.attrsMap) {
+    if (!isConditionAttr(attr)) {
+      continue
+    }
+    const binding = getAndRemoveAttr(el, attr)
+    switch (attr) {
+      case 'v-if': {
+        addAttr(el, '[[match]]', binding)
+        el.attrsMap['[[match]]'] = binding
+        el.attrsList.push({ name: '[[match]]', value: binding })
+        delete el.attrsMap[attr]
+        delete el.if
+        delete el.ifConditions
+        break
+      }
+
+      // TODO: support v-else and v-else-if
+    }
+  }
+}