@dolphinweex/weex-harmony 0.1.53 → 0.1.55

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dolphinweex/weex-harmony",
-  "version": "0.1.53",
+  "version": "0.1.55",
   "description": "weex harmony adapter",
   "main": "index.js",
   "files": [

package/src/components/hl-web-base.vue

@@ -38,6 +38,10 @@ props: {
   harmonyStyle: {
     type: Object,
     required: false,
+  },
+    onMessage: {
+    type: Function,
+    default: () => {}
   }
 },
 
@@ -68,23 +72,17 @@ mounted() {
       that.onMessage(event.data)
     }
   });
-
-  this.$refs["iframe"].addEventListener('load', this.onPageFinish);
-
-  this.$refs["error"].addEventListener('load', this.onError);
 },
 methods: { 
   postMessage(message){
-    const iframe = this.$refs["iframe"]
-    const target = new URL(iframe.src).origin
-    iframe.contentWindow.postMessage(message, target)
+    // const iframe = this.$refs["iframe"]
+    // const target = new URL(iframe.src).origin
+    // iframe.contentWindow.postMessage(message, target)
     //this.$refs["iframe"].contentWindow.postMessage(message, this.src)
   },
   // 自定义拓展其它逻辑
   onPageFinish(res) {
       console.log("[web] pagefinish ", res);
-      this.$refs["iframe"].contentWindow.$midea_harmony_native = window.$midea_harmony_native
-      this.$refs["iframe"].contentWindow.postMessage(JSON.stringify(window.$midea_harmony_native), '*');
       this.$emit("pagefinish", res);
   },
   onPageStart(res) {

package/src/components/midea-video.vue

@@ -27,7 +27,7 @@ export default {
     },
     autoplay: {
       type: Boolean,
-      default: true,
+      default: false,
     },
     src: {
       type: String,

package/src/transform-loader.js

@@ -22,10 +22,12 @@ const componentMap = require("./index")
 
 const componentSet = new Set()
 const vBindMap = new Map()
+// v-for 场景下，将 v-bind 转为方法调用所需的方法映射
+const vBindMethodMap = new Map()
 
 /**
  * 判断是否为windows环境
- * @returns 
+ * @returns
  */
 function isWin32(){
   if(process.platform === 'win32') {
@@ -68,52 +70,67 @@ function hasTargetElement(tagName) {
  * @param {*} node html节点
  */
 function traverseNode(node, parent = null) {
-  if (node.type === 'element') {
+    if (node.type === 'element') {
     const { hasElement, componentName } = hasTargetElement(node.tagName);
     if (hasElement) {
       componentSet.add(componentName);
     }
 
-    // 判断父节点是否有 v-for，若父节点是 <template> 且有 v-for，则跳过
-    const isInsideVFor = parent && parent.attributes && parent.attributes.some(attr => attr.key === 'v-for');
-    
-    if (!isInsideVFor) {  // 如果不在 v-for 中，才处理 v-bind
-      if (node.attributes) {
-        node.attributes.forEach((attr, index) => {
-          if (attr.key === 'v-bind') {
-            // 如果是对象绑定，处理 style 属性
-            if (attr.value.trim().startsWith('{') && attr.value.trim().endsWith('}')) {
+    // 判断当前或父节点是否处于 v-for 场景
+    const hasVForInParent = parent && parent.attributes && parent.attributes.some(attr => attr.key === 'v-for')
+    const hasVForInCurrent = node.attributes && node.attributes.some(attr => attr.key === 'v-for')
+    const isInsideVFor = hasVForInParent || hasVForInCurrent
+
+    if (node.attributes) {
+      node.attributes.forEach((attr, index) => {
+        if (attr.key === 'v-bind') {
+          if (isInsideVFor) {
+            // v-for 场景：将 v-bind="expr" 转为 v-bind="customVBindMethodX(expr)"
+            const methodName = `customVBindMethod${index}`;
+            const argExpression = (attr.value || '').trim() || 'arg';
+            const paramName = 'arg';
+            if (!vBindMethodMap.has(methodName)) {
+              vBindMethodMap.set(methodName, { paramName });
+            }
+            // 更新模板中的属性为方法调用
+            node.attributes[index].value = `${methodName}(${argExpression})`;
+          } else {
+            if (
+              attr.value.trim().startsWith('{') &&
+              attr.value.trim().endsWith('}')
+            ) {
               const parsedAst = parser.parseExpression(attr.value);
-              const styleProperty = parsedAst.properties.find(prop => prop.key && prop.key.name === 'style');
+              const styleProperty = parsedAst.properties.find(
+                (prop) => prop.key && prop.key.name === 'style'
+              );
               if (styleProperty) {
                 const styleValue = styleProperty.value;
-
                 // style 的值套上 _px2rem 方法
                 styleProperty.value = {
                   type: 'CallExpression',
                   callee: {
                     type: 'Identifier',
-                    name: '_px2rem'
+                    name: '_px2rem',
                   },
-                  arguments: [styleValue] // 将原始的 style 对象作为参数传递给 _px2rem
+                  arguments: [styleValue], // 将原始的 style 对象作为参数传递给 _px2rem
                 };
               }
               node.attributes[index] = {
                 key: 'v-bind',
-                value: generator(parsedAst).code
+                value: generator(parsedAst).code,
               };
             } else {
               const customComputedName = `customVBindComputed${index}`; // 自定义的名字
               vBindMap.set(customComputedName, {
                 computedName: attr.value,
-                customComputedName
+                customComputedName,
               });
               // 更新属性值为自定义名字
               node.attributes[index].value = customComputedName;
             }
           }
-        });
-      }
+        }
+      });
     }
 
     // 继续递归处理子节点
@@ -200,7 +217,7 @@ function createComputedProperty(vBindValue, computedName) {
                       t.memberExpression(t.thisExpression(), t.identifier(vBindValue)),
                       t.identifier('style')  // this.scrollerWrapProps.style
                     ),
-                    t.callExpression(
+            t.callExpression(
                       t.identifier('this._px2rem'),  // weex._px2remFn 函数
                       [//函数传参
                         t.memberExpression(
@@ -213,13 +230,19 @@ function createComputedProperty(vBindValue, computedName) {
                 )
               ]),
             ),
-            t.returnStatement( //return 值
-              t.memberExpression(t.thisExpression(), t.identifier(vBindValue))  // this.scrollerWrapProps
+            t.returnStatement( // 返回浅拷贝新对象，确保引用变化以触发依赖更新
+              t.callExpression(
+                t.memberExpression(t.identifier('Object'), t.identifier('assign')),
+                [
+                  t.objectExpression([]),
+                  t.memberExpression(t.thisExpression(), t.identifier(vBindValue))
+                ]
+              )
             )
           ])
-        )
       )
-    ])
+    )
+  ])
   );
 }
 
@@ -233,7 +256,7 @@ function getAbsPath(address){
   const componentAbsolute = path.resolve(__dirname, address)
   if(isWin32()) {
     return path.relative(currentModulePath, componentAbsolute).replace('..\\','').replace(/\\/g,'/')
-  } else {
+      } else {
     return path.relative(currentModulePath, componentAbsolute).replace('../','')
   }
 }
@@ -256,7 +279,7 @@ function generateCode(moduleResoveRet) {
     Object.keys(moduleResoveRet.styles[i].attrs).forEach((item) => {
       if (typeof moduleResoveRet.styles[i].attrs[item] === 'boolean') {
         styleAttrs += ` ${item}`
-      } else {
+    } else {
         styleAttrs += ` ${item}="${moduleResoveRet.styles[i].attrs[item]}"`
       }
     })
@@ -266,7 +289,7 @@ function generateCode(moduleResoveRet) {
   Object.keys(moduleResoveRet.script.attrs).forEach((item) => {
     if (typeof moduleResoveRet.script.attrs[item] === 'boolean') {
       scriptAttrs += ` ${item}`
-    } else {
+        } else {
       scriptAttrs += ` ${item}="${moduleResoveRet.script.attrs[item]}"`
     }
   })
@@ -333,6 +356,92 @@ function addComputedPropertyToScript(scriptAst, vBindMap) {
     });
   });
 }
+// v-for: 注入 v-bind 方法（接收循环项，px2rem，返回新对象）
+/**
+ * v-for 场景专用：将模板中的 v-bind="expr" 改写为 v-bind="method(expr)"
+ * - methodName: 注入到 methods 的方法名
+ * - paramName: 方法形参名（通常对应 v-for 的循环项，如 item）
+ * 处理目标：
+ * 1) 若参数存在且包含 style 字段，则对 style 执行 this._px2rem 单位转换（px → rem）
+ * 2) 返回一个全新的浅拷贝对象，保证引用变化，便于触发响应式更新
+ */
+function createVBindMethod(methodName, paramName) {
+  return t.objectMethod(
+    'method',
+    t.identifier(methodName),
+    [t.identifier(paramName)],
+    t.blockStatement([
+      t.ifStatement(
+        t.logicalExpression(
+          '&&',
+          t.identifier(paramName),
+          t.memberExpression(t.identifier(paramName), t.identifier('style'))
+        ),
+        // 1) 如果入参存在且包含 style，先做 px → rem 转换
+        t.blockStatement([
+          t.expressionStatement(
+            t.assignmentExpression(
+              '=',
+              t.memberExpression(t.identifier(paramName), t.identifier('style')),
+              t.callExpression(
+                t.memberExpression(t.thisExpression(), t.identifier('_px2rem')),
+                [t.memberExpression(t.identifier(paramName), t.identifier('style'))]
+              )
+            )
+          )
+        ])
+      ),
+      // 2) 返回一个新对象（浅拷贝）以改变引用地址，便于触发依赖更新
+      t.returnStatement(
+        t.callExpression(
+          t.memberExpression(t.identifier('Object'), t.identifier('assign')),
+          [t.objectExpression([]), t.identifier(paramName)]
+        )
+      )
+    ])
+  )
+}
+
+function addVBindMethodsToScript(scriptAst, vBindMethodMap) {
+  if (vBindMethodMap.size === 0) return
+
+  function ensureMethodsAndInsert(properties, methodNodes) {
+    let methodsNode = properties.find(p => p.key && p.key.name === 'methods')
+    if (!methodsNode) {
+      methodsNode = t.objectProperty(t.identifier('methods'), t.objectExpression([]))
+      properties.push(methodsNode)
+    }
+    methodNodes.forEach(node => {
+      const exists = methodsNode.value.properties.find(p => p.key && p.key.name === node.key.name)
+      if (!exists) methodsNode.value.properties.push(node)
+    })
+  }
+
+  const methodNodes = []
+  vBindMethodMap.forEach((info, name) => {
+    methodNodes.push(createVBindMethod(name, info.paramName || 'arg'))
+  })
+
+  traverse(scriptAst, {
+    ExportDefaultDeclaration(path) {
+      if (t.isObjectExpression(path.node.declaration)) {
+        ensureMethodsAndInsert(path.node.declaration.properties, methodNodes)
+      }
+    },
+    AssignmentExpression(path) {
+      const left = path.node.left
+      const right = path.node.right
+      if (
+        t.isMemberExpression(left) &&
+        left.object && left.object.name === 'module' &&
+        left.property && left.property.name === 'exports' &&
+        t.isObjectExpression(right)
+      ) {
+        ensureMethodsAndInsert(right.properties, methodNodes)
+      }
+    }
+  })
+}
 
 module.exports = function (source) {
   if (process.env.ISHARMONY === 'true') {
@@ -344,8 +453,8 @@ module.exports = function (source) {
       styles
     } = moduleResoveRet
     if (!template) {
-      return source
-    }
+  return source
+}
 
     const tempAst = parse(template.content)
     tempAst.forEach((node) => {
@@ -355,19 +464,19 @@ module.exports = function (source) {
     moduleResoveRet.template.content = stringify(tempAst); 
 
     const scriptAst = parser.parse(script.content, {
-      sourceType: 'module',
+    sourceType: 'module',
     // 在此添加需要解析的插件
     })
 
     // 单模块中引入了自定义组件    if (componentSet.size !== 0) {
     if (componentSet.size !== 0) {
       traverse(scriptAst, {
-        Program(path) {
+    Program(path) {
           componentSet.forEach((componentName) => {
             path.unshiftContainer('body', buildImportDeclaration(componentName))
           })
-        },
-        AssignmentExpression(path) {
+    },
+    AssignmentExpression(path) {
           const left = path.node.left;
           if (
             left.type === 'MemberExpression' &&
@@ -378,9 +487,9 @@ module.exports = function (source) {
               if (t.isObjectExpression(path.node.right)) {
                 const properties = path.node.right.properties
                 const result = properties.find(item => item.key.name == 'components')
-                if (result) {
+            if (result) {
                   addComponentsProperty(result)
-                } else {
+            } else {
                   const componentsAst = t.objectProperty(t.identifier('components'), t.objectExpression([]))
                   properties.push(componentsAst)
                   addComponentsProperty(componentsAst)
@@ -388,15 +497,15 @@ module.exports = function (source) {
               }
             }
           }
-        },
-        ExportDefaultDeclaration(path) {
+    },
+    ExportDefaultDeclaration(path) {
           if (componentSet.size !== 0) {
             if (t.isObjectExpression(path.node.declaration)) {
               const properties = path.node.declaration.properties
               const result = properties.find(item => item.key.name == 'components')
               if (result) {
                 addComponentsProperty(result)
-              } else {
+                } else {
                 const componentsAst = t.objectProperty(t.identifier('components'), t.objectExpression([]))
                 properties.push(componentsAst)
                 addComponentsProperty(componentsAst)
@@ -413,6 +522,10 @@ module.exports = function (source) {
       addComputedPropertyToScript(scriptAst, vBindMap);
       vBindMap.clear()
     }
+    if (vBindMethodMap.size !== 0) {
+      addVBindMethodsToScript(scriptAst, vBindMethodMap)
+      vBindMethodMap.clear()
+    }
 
     const {
       code