fix(tarozie): props 需要在 render 结构

NervJS · Nov 19, 2018 · 46736d8 · 46736d8
1 parent f94b5f0
commit 46736d8
Showing 1 changed file with 53 additions and 8 deletions.
diff --git a/packages/taroize/src/script.ts b/packages/taroize/src/script.ts
@@ -97,7 +97,11 @@ export function parseScript (
   return ast
 }
 
-function buildRender (returned: t.Expression, stateKeys: string[]) {
+function buildRender (
+  returned: t.Expression,
+  stateKeys: string[],
+  propsKeys: string[]
+) {
   const returnStatement: t.Statement[] = [t.returnStatement(returned)]
   if (stateKeys.length) {
     const stateDecl = t.variableDeclaration('const', [
@@ -110,6 +114,18 @@ function buildRender (returned: t.Expression, stateKeys: string[]) {
     ])
     returnStatement.unshift(stateDecl)
   }
+
+  if (propsKeys.length) {
+    const stateDecl = t.variableDeclaration('const', [
+      t.variableDeclarator(
+        t.objectPattern(propsKeys.map(s =>
+          t.objectProperty(t.identifier(s), t.identifier(s))
+        ) as any),
+        t.memberExpression(t.thisExpression(), t.identifier('props'))
+      )
+    ])
+    returnStatement.unshift(stateDecl)
+  }
   return t.classMethod(
     'method',
     t.identifier('render'),
@@ -127,6 +143,7 @@ function parsePage (
   componentType?: string
 ) {
   const stateKeys: string[] = []
+  const propsKeys: string[] = []
   const arg = path.get('arguments')[0]
   if (!arg || !arg.isObjectExpression()) {
     return
@@ -146,14 +163,40 @@ function parsePage (
     const name = key.node.name
     if (name === 'data') {
       if (value.isObjectExpression()) {
-        value.get('properties').map(p => p.node).forEach(prop => {
-          if (t.isObjectProperty(prop) && t.isIdentifier(prop.key)) {
-            stateKeys.push(prop.key.name)
-          }
-        })
+        value
+          .get('properties')
+          .map(p => p.node)
+          .forEach(prop => {
+            if (t.isObjectProperty(prop)) {
+              if (t.isStringLiteral(prop.key)) {
+                stateKeys.push(prop.key.value)
+              }
+              if (t.isIdentifier(prop.key)) {
+                stateKeys.push(prop.key.name)
+              }
+            }
+          })
       }
       return t.classProperty(t.identifier('state'), value.node)
     }
+    if (name === 'properties') {
+      if (value.isObjectExpression()) {
+        value
+          .get('properties')
+          .map(p => p.node)
+          .forEach(prop => {
+            if (t.isObjectProperty(prop)) {
+              if (t.isStringLiteral(prop.key)) {
+                propsKeys.push(prop.key.value)
+              }
+              if (t.isIdentifier(prop.key)) {
+                propsKeys.push(prop.key.name)
+              }
+            }
+          })
+      }
+      return false
+    }
     if (PageLifecycle.has(name)) {
       const lifecycle = PageLifecycle.get(name)!
       const node = value.node as t.FunctionExpression | t.ArrowFunctionExpression
@@ -175,12 +218,14 @@ function parsePage (
     )
   }
 
-  const renderFunc = buildRender(returned, stateKeys)
+  const renderFunc = buildRender(returned, stateKeys, propsKeys)
 
   return t.classDeclaration(
     t.identifier(componentType === 'App' ? 'App' : defaultClassName),
     t.memberExpression(t.identifier('Taro'), t.identifier('Component')),
-    t.classBody(classBody.concat(renderFunc)),
+    t.classBody(
+      (classBody.filter(Boolean) as t.ClassMethod[]).concat(renderFunc)
+    ),
     []
   )
 }