feat: 修改手表端表达式打包结果

packages/hap-compiler/src/template/validator.js

@@ -2148,5 +2148,6 @@ export default {
   isEmptyElement,
   isNotTextContentAtomic,
   isExpr: exp.isExpr,
-  parseText: exp.parseText
+  parseText: exp.parseText,
+  exp: exp
 }

packages/hap-packager/src/post-handler/js-card-post.js

@@ -2,17 +2,7 @@
  * Copyright (c) 2024-present, the hapjs-platform Project Contributors
  * SPDX-License-Identifier: Apache-2.0
  */
-import {
-  getExprType,
-  isFunctionStr,
-  isObject,
-  isConstObjOrArray,
-  isSimpleArr,
-  isSimplePath,
-  EXPR_TYPE
-} from './utils'
-import { templater } from '@hap-toolkit/compiler'
-const { validator } = templater
+import { getExprType, isFunctionStr, isObject, EXPR_TYPE, getNewJsCardExprRes } from './utils'
 
 const CARD_ENTRY = '#entry'
 const TYPE_IMPORT = 'import'
@@ -102,7 +92,7 @@ function markIf(template) {
 
   const exprType = getExprType(template.shownRaw)
   if (exprType === EXPR_TYPE.CONST_IN_EXPRESSION || exprType === EXPR_TYPE.EXPRESSION) {
-    const exprRes = getExprRes(template.shownRaw, template.shown)
+    const exprRes = getNewJsCardExprRes(template.shownRaw, template.shown)
     if (exprType === EXPR_TYPE.EXPRESSION) {
       template['$shown'] = exprRes
       delete template.shown
@@ -119,7 +109,7 @@ function markIs(template) {
 
   const exprType = getExprType(template.isRaw)
   if (exprType === EXPR_TYPE.CONST_IN_EXPRESSION || exprType === EXPR_TYPE.EXPRESSION) {
-    const exprRes = getExprRes(template.isRaw, template.is)
+    const exprRes = getNewJsCardExprRes(template.isRaw, template.is)
     if (exprType === EXPR_TYPE.EXPRESSION) {
       template['$is'] = exprRes
       delete template.is
@@ -136,7 +126,7 @@ function markId(template) {
 
   const exprType = getExprType(template.idRaw)
   if (exprType === EXPR_TYPE.CONST_IN_EXPRESSION || exprType === EXPR_TYPE.EXPRESSION) {
-    const exprRes = getExprRes(template.idRaw, template.id)
+    const exprRes = getNewJsCardExprRes(template.idRaw, template.id)
     if (exprType === EXPR_TYPE.EXPRESSION) {
       template['$id'] = exprRes
       delete template.id
@@ -172,7 +162,7 @@ function markFor(template) {
     */
     const exprType = getExprType(template.repeatRaw.expRaw)
     if (exprType === EXPR_TYPE.CONST_IN_EXPRESSION || exprType === EXPR_TYPE.EXPRESSION) {
-      const exprRes = getExprRes(template.repeatRaw.expRaw, template.repeat.exp)
+      const exprRes = getNewJsCardExprRes(template.repeatRaw.expRaw, template.repeat.exp)
       if (exprType === EXPR_TYPE.EXPRESSION) {
         template.repeat['$exp'] = exprRes
         delete template.repeat.exp
@@ -187,7 +177,7 @@ function markFor(template) {
     */
     const exprType = getExprType(template.repeatRaw)
     if (exprType === EXPR_TYPE.CONST_IN_EXPRESSION || exprType === EXPR_TYPE.EXPRESSION) {
-      const exprRes = getExprRes(template.repeatRaw, template.repeat)
+      const exprRes = getNewJsCardExprRes(template.repeatRaw, template.repeat)
       if (exprType === EXPR_TYPE.EXPRESSION) {
         template['$repeat'] = exprRes
         delete template.repeat
@@ -209,7 +199,7 @@ function markStyle(template) {
     Object.keys(style).forEach((key) => {
       const exprType = getExprType(styleRaw[key])
       if (exprType === EXPR_TYPE.CONST_IN_EXPRESSION || exprType === EXPR_TYPE.EXPRESSION) {
-        const exprRes = getExprRes(styleRaw[key], style[key])
+        const exprRes = getNewJsCardExprRes(styleRaw[key], style[key])
         if (exprType === EXPR_TYPE.EXPRESSION) {
           template.style['$' + key] = exprRes
           delete template.style[key]
@@ -222,7 +212,7 @@ function markStyle(template) {
   } else {
     const exprType = getExprType(styleRaw)
     if (exprType === EXPR_TYPE.CONST_IN_EXPRESSION || exprType === EXPR_TYPE.EXPRESSION) {
-      const exprRes = getExprRes(styleRaw, template.style)
+      const exprRes = getNewJsCardExprRes(styleRaw, template.style)
       if (exprType === EXPR_TYPE.EXPRESSION) {
         template['$style'] = exprRes
         delete template.style
@@ -240,7 +230,7 @@ function markClass(template) {
 
   const exprType = getExprType(template.classListRaw)
   if (exprType === EXPR_TYPE.CONST_IN_EXPRESSION || exprType === EXPR_TYPE.EXPRESSION) {
-    const exprRes = getExprRes(template.classListRaw, template.classList)
+    const exprRes = getNewJsCardExprRes(template.classListRaw, template.classList)
     if (exprType === EXPR_TYPE.EXPRESSION) {
       template['$class'] = exprRes
       template['$classList'] = exprRes
@@ -278,7 +268,7 @@ function markAttr(template) {
       if (attrValueRaw !== undefined) {
         const exprType = getExprType(attrValueRaw)
         if (exprType === EXPR_TYPE.CONST_IN_EXPRESSION || exprType === EXPR_TYPE.EXPRESSION) {
-          const exprRes = getExprRes(attrValueRaw, attr[attrKey])
+          const exprRes = getNewJsCardExprRes(attrValueRaw, attr[attrKey])
           if (exprType === EXPR_TYPE.EXPRESSION) {
             attr['$' + attrKey] = exprRes
             delete attr[attrKey]
@@ -293,26 +283,6 @@ function markAttr(template) {
   }
 }
 
-function getExprRes(exprRaw, expr) {
-  const tokens = validator.parseText(exprRaw.trim())
-  if (tokens.length > 1) {
-    return expr
-  }
-
-  const parsed = tokens[0].value
-  if (isConstObjOrArray(parsed)) {
-    // 简单表达式 {{ [1,2,3] }}、{{ {a: 1} }}
-    // eslint-disable-next-line no-eval
-    return eval(`(${parsed})`)
-  } else if (isSimplePath(parsed) && isSimpleArr(parsed)) {
-    // 简单表达式 {{name}}、{{title.name}}、{{title['name']}}、{{title[0]}}
-    return parsed // {{ name }} -> name
-  } else {
-    // 复杂表达式，返回function形式的表达式结果
-    return expr // {{a + b}} -> function () { return this.a + this.b }
-  }
-}
-
 export function postHandleJSCardRes(JsCardRes) {
   const uxList = Object.keys(JsCardRes)
 

packages/hap-packager/src/post-handler/lite-card-post.js

@@ -4,7 +4,14 @@
  */
 
 import { templateValueToCardCode } from '@aiot-toolkit/card-expression'
-import { isExpr, isObject, isConstObjOrArray, isSimpleArr, isSimplePath } from './utils'
+import {
+  isExpr,
+  isObject,
+  isConstObjOrArray,
+  isSimpleArr,
+  isSimplePath,
+  getNewJsCardExprRes
+} from './utils'
 import { templater } from '@hap-toolkit/compiler'
 const { validator } = templater
 
@@ -44,9 +51,11 @@
 
 function markType(actions) {
   if (isExpr(actions.type)) {
-    let { rawExpr, prefixExpr } = getPrefixExpr(actions.type)
+    const expContent = actions.type
+    let { prefixExpr } = getPrefixExpr(expContent)
     delete actions.type
-    actions['$type'] = rawExpr
+    const funcStr = validator.exp(expContent, true, false, true)
+    actions['$type'] = getNewJsCardExprRes(expContent, funcStr)
     actions['#type'] = prefixExpr
   }
 }
@@ -56,14 +65,16 @@
   // 如为数组，则遍历数组进行表达式处理
   if (typeof actions.url === 'string') {
     if (isExpr(actions.url)) {
-      let { rawExpr, prefixExpr } = getPrefixExpr(actions.url)
+      const expContent = actions.url
+      let { prefixExpr } = getPrefixExpr(expContent)
       delete actions.url
-      actions['$url'] = rawExpr
+      const funcStr = validator.exp(expContent, true, false, true)
+      actions['$url'] = getNewJsCardExprRes(expContent, funcStr)
       actions['#url'] = prefixExpr
     }
   } else if (Array.isArray(actions.url)) {
     let hasBinding = false
     const rawUrlList = actions.url.map((url) => {
       if (isExpr(url)) {
         hasBinding = true
         let { rawExpr } = getPrefixExpr(url)
@@ -83,16 +94,18 @@
 
     if (hasBinding) {
       delete actions.url
-      actions['$url'] = rawUrlList
+      // actions['$url']  url 是数组的写法，手表标准上不支持
       actions['#url'] = prefixUrlList
     }
   }
 }
 function markMethod(actions) {
   if (isExpr(actions.method)) {
-    let { rawExpr, prefixExpr } = getPrefixExpr(actions.method)
+    const expContent = actions.method
+    let { prefixExpr } = getPrefixExpr(expContent)
     delete actions.method
-    actions['$method'] = rawExpr
+    const funcStr = validator.exp(expContent, true, false, true)
+    actions['$method'] = getNewJsCardExprRes(expContent, funcStr)
     actions['#method'] = prefixExpr
   }
 }
@@ -104,9 +117,10 @@
   Object.keys(actions.params).forEach((key) => {
     const value = actions.params[key]
     if (isExpr(value)) {
-      let { rawExpr, prefixExpr } = getPrefixExpr(value)
+      let { prefixExpr } = getPrefixExpr(value)
       delete actions.params[key]
-      actions.params['$' + key] = rawExpr
+      const funcStr = validator.exp(value, true, false, true)
+      actions.params['$' + key] = getNewJsCardExprRes(value, funcStr)
       actions.params['#' + key] = prefixExpr
     }
   })
@@ -175,9 +189,11 @@
   if (!template.shown) return
 
   if (isExpr(template.shown)) {
-    let { rawExpr, prefixExpr } = getPrefixExpr(template.shown)
+    const expContent = template.shown
+    let { prefixExpr } = getPrefixExpr(expContent)
     delete template.shown
-    template['$shown'] = rawExpr
+    const funcStr = validator.exp(expContent, true, false, true)
+    template['$shown'] = getNewJsCardExprRes(expContent, funcStr)
     template['#shown'] = prefixExpr
   }
   template.kind = markKind(template.kind, ENUM_KIND_TYPE.FRAGMENT.kind)
@@ -187,9 +203,11 @@
   if (!template.is) return
 
   if (isExpr(template.is)) {
-    let { rawExpr, prefixExpr } = getPrefixExpr(template.is)
+    const expContent = template.is
+    let { prefixExpr } = getPrefixExpr(expContent)
     delete template.is
-    template['$is'] = rawExpr
+    const funcStr = validator.exp(expContent, true, false, true)
+    template['$is'] = getNewJsCardExprRes(expContent, funcStr)
     template['#is'] = prefixExpr
     template.kind = markKind(template.kind, ENUM_KIND_TYPE.ELEMENT.kind)
   }
@@ -199,9 +217,11 @@
   if (!template.id) return
 
   if (isExpr(template.id)) {
-    let { rawExpr, prefixExpr } = getPrefixExpr(template.id)
+    const expContent = template.id
+    let { prefixExpr } = getPrefixExpr(expContent)
     delete template.id
-    template['$id'] = rawExpr
+    const funcStr = validator.exp(expContent, true, false, true)
+    template['$id'] = getNewJsCardExprRes(expContent, funcStr)
     template['#id'] = prefixExpr
   }
   // 节点有id属性，标记为kind 为 1
@@ -232,9 +252,11 @@
           "value": "item"
         },
       */
-      let { rawExpr, prefixExpr } = getPrefixExpr(template.repeat.exp)
+      const expContent = template.repeat.exp
+      let { prefixExpr } = getPrefixExpr(expContent)
       delete template.repeat.exp
-      template.repeat['$exp'] = rawExpr
+      const funcStr = validator.exp(expContent, true, false, true)
+      template.repeat['$exp'] = getNewJsCardExprRes(expContent, funcStr)
       template.repeat['#exp'] = prefixExpr
     }
   } else if (isExpr(template.repeat)) {
@@ -243,9 +265,11 @@
       "$repeat": "ItemList",
       "#repeat": ["$", "ItemList"],
     */
-    let { rawExpr, prefixExpr } = getPrefixExpr(template.repeat)
+    const expContent = template.repeat
+    let { prefixExpr } = getPrefixExpr(expContent)
     delete template.repeat
-    template['$repeat'] = rawExpr
+    const funcStr = validator.exp(expContent, true, false, true)
+    template['$repeat'] = getNewJsCardExprRes(expContent, funcStr)
     template['#repeat'] = prefixExpr
   }
   template.kind = markKind(template.kind, ENUM_KIND_TYPE.FRAGMENT.kind)
@@ -259,18 +283,21 @@
     Object.keys(style).forEach((key) => {
       const value = style[key]
       if (isExpr(value)) {
-        let { rawExpr, prefixExpr } = getPrefixExpr(value)
+        let { prefixExpr } = getPrefixExpr(value)
         delete template.style[key]
-        template.style['$' + key] = rawExpr
+        const funcStr = validator.exp(value, true, false, true)
+        template.style['$' + key] = getNewJsCardExprRes(value, funcStr)
         template.style['#' + key] = prefixExpr
         template.kind = markKind(template.kind, ENUM_KIND_TYPE.ELEMENT.kind)
       }
     })
   } else {
     if (isExpr(style)) {
-      let { rawExpr, prefixExpr } = getPrefixExpr(style)
+      const expContent = style
+      let { prefixExpr } = getPrefixExpr(expContent)
       delete template.style
-      template['$style'] = rawExpr
+      const funcStr = validator.exp(expContent, true, false, true)
+      template['$style'] = getNewJsCardExprRes(expContent, funcStr)
       template['#style'] = prefixExpr
       template.kind = markKind(template.kind, ENUM_KIND_TYPE.ELEMENT.kind)
     }
@@ -281,9 +308,11 @@
   if (!template.class || template.class.length === 0) return
 
   if (isExpr(template.class)) {
-    let { rawExpr, prefixExpr } = getPrefixExpr(template.class)
+    const expContent = template.class
+    let { prefixExpr } = getPrefixExpr(expContent)
     delete template.class
-    template['$class'] = rawExpr
+    const funcStr = validator.exp(expContent, true, false, true)
+    template['$class'] = getNewJsCardExprRes(expContent, funcStr)
     template['#class'] = prefixExpr
     template.kind = markKind(template.kind, ENUM_KIND_TYPE.ELEMENT.kind)
   }
@@ -324,9 +353,10 @@
     Object.keys(attr).forEach((attrKey) => {
       const attrValue = attr[attrKey]
       if (isExpr(attrValue)) {
-        let { rawExpr, prefixExpr } = getPrefixExpr(attrValue)
+        let { prefixExpr } = getPrefixExpr(attrValue)
         delete attr[attrKey]
-        attr['$' + attrKey] = rawExpr
+        const funcStr = validator.exp(attrValue, true, false, true)
+        attr['$' + attrKey] = getNewJsCardExprRes(attrValue, funcStr)
         attr['#' + attrKey] = prefixExpr
         template.kind = markKind(template.kind, ENUM_KIND_TYPE.ELEMENT.kind)
       }

packages/hap-packager/src/post-handler/utils.js

@@ -86,3 +86,23 @@ export function isSimplePath(exp) {
     exp.slice(0, 5) !== 'Math.'
   )
 }
+
+export function getNewJsCardExprRes(exprRaw, expr) {
+  const tokens = validator.parseText(exprRaw.trim())
+  if (tokens.length > 1) {
+    return expr
+  }
+
+  const parsed = tokens[0].value
+  if (isConstObjOrArray(parsed)) {
+    // 简单表达式 {{ [1,2,3] }}、{{ {a: 1} }}
+    // eslint-disable-next-line no-eval
+    return eval(`(${parsed})`)
+  } else if (isSimplePath(parsed) && isSimpleArr(parsed)) {
+    // 简单表达式 {{name}}、{{title.name}}、{{title['name']}}、{{title[0]}}
+    return parsed // {{ name }} -> name
+  } else {
+    // 复杂表达式，返回function形式的表达式结果
+    return expr // {{a + b}} -> function () { return this.a + this.b }
+  }
+}