对组件传参重新封装

WebService/src/main/java/com/java110/web/core/VueComponentElement.java

@@ -100,6 +100,7 @@ public class VueComponentElement extends AbstractMarkupSubstitutionElementProces
         }
 
         String[] tmpType = tmpProTypes.split(",");
+        StringBuffer propsJs = new StringBuffer("\nvar $props = {};\n");
         for (String type : tmpType) {
             if (StringUtils.isEmpty(type) || !type.contains(":")) {
                 continue;
@@ -114,9 +115,20 @@ public class VueComponentElement extends AbstractMarkupSubstitutionElementProces
                 throw new TemplateProcessingException("组件[" + componentName + "]未配置组件属性" + attrKey);
             }
             String vcType = element.getAttributeValue(attrKey);
-            js = js.replace(attrKey, "'" + vcType + "'");
+            if (types[1].equals("vc.propTypes.string")) {
+                vcType = "'" + vcType + "'";
+            }
+            propsJs.append("$props." + attrKey + "=" + vcType + ";\n");
+        }
 
+        //将propsJs 插入到 第一个 { 之后
+        int position = js.indexOf("{");
+        if (position < 0) {
+            String componentName = element.getAttributeValue("name");
+            logger.error("组件" + componentName + "对应js 未包含 {}  ");
+            throw new TemplateProcessingException("组件" + componentName + "对应js 未包含 {}  ");
         }
+        js = new StringBuffer(js).insert(position + 1, propsJs).toString();
         return js;
     }
 

WebService/src/main/resources/components/room-select-floor/roomSelectFloor.html

@@ -38,8 +38,8 @@
         </div>
     </div>
     <vc:create name="searchFloor"
-               @emitChooseFloor="roomSelectFloor"
-               @emitLoadData="room"
+               emitChooseFloor="roomSelectFloor"
+               emitLoadData="room"
     ></vc:create>
     <vc:create name="addRoom"></vc:create>
 </div>

WebService/src/main/resources/components/room-select-floor/roomSelectFloor.js

@@ -5,7 +5,7 @@
 
     vc.extends({
         propTypes: {
-            @OpenAddRoomModelName:'string'
+            openAddRoomModelName:vc.propTypes.string
         },
         data:{
             floorInfo:{
@@ -29,7 +29,7 @@
                 vc.emit('searchFloor','openSearchFloorModel',{});
             },
             openAddRoomModel:function(){
-                vc.emit(@OpenAddRoomModelName,'addRoomModel',{
+                vc.emit($props.openAddRoomModelName,'addRoomModel',{
                     floorId:vc.component.floorInfo.floorId
                 });
             },

WebService/src/main/resources/components/room/room.html

@@ -1,6 +1,6 @@
 <div id="component" class="wrapper wrapper-content animated fadeInRight ecommerce">
     <vc:create name="roomSelectFloor"
-               @OpenAddRoomModelName="addRoom"
+               openAddRoomModelName="addRoom"
     ></vc:create>
     <div class="row">
         <div class="col-lg-12">

WebService/src/main/resources/components/search-floor/searchFloor.js

@@ -1,8 +1,8 @@
 (function(vc){
     vc.extends({
         propTypes: {
-           @emitChooseFloor:'string',
-           @emitLoadData:'string'
+           emitChooseFloor:vc.propTypes.string,
+           emitLoadData:vc.propTypes.string
         },
         data:{
             searchFloorInfo:{
@@ -45,8 +45,8 @@
                            );
             },
             chooseFloor:function(_floor){
-                vc.emit(@emitChooseFloor,'chooseFloor',_floor);
-                vc.emit(@emitLoadData,'loadData',{
+                vc.emit($props.emitChooseFloor,'chooseFloor',_floor);
+                vc.emit($props.emitLoadData,'loadData',{
                     floorId:_floor.floorId
                 });
                 $('#searchFloorModel').modal('hide');

WebService/src/main/resources/components/unit-select-floor/unitSelectFloor.html

@@ -38,8 +38,8 @@
         </div>
     </div>
     <vc:create name="searchFloor"
-               @emitChooseFloor="unitSelectFloor"
-               @emitLoadData="unit"
+               emitChooseFloor="unitSelectFloor"
+               emitLoadData="unit"
     ></vc:create>
     <vc:create name="addUnit"></vc:create>
 </div>

WebService/src/main/resources/static/js/core.js

@@ -225,4 +225,16 @@
       var s = time.getSeconds();
       return y+'-'+add0(m)+'-'+add0(d)+' '+add0(h)+':'+add0(mm)+':'+add0(s);
     }
-})(window.vc);
+})(window.vc);
+
+
+(function(vc){
+
+    vc.propTypes = {
+        string:"string",//字符串类型
+        array:"array",
+        object:"object",
+        number:"number"
+    }
+
+})(window.vc)

WebService/src/main/resources/views/test.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Title</title>
+</head>
+<body>
+
+<script>
+    (function(){
+        var $props = {
+            aaa:123
+        }
+        console.log($props.aaa);
+    })()
+
+</script>
+
+</body>
+</html>