1

hello_taobao.json

@@ -80,9 +80,9 @@
 				"viewType": "Panel",
 				"children": [
 					{
-						"name": "rulePanelInner",
-						"uuid": "3efdd94c-51b8-4423-b361-d5424523b8d0",
-						"componentName": "Div",
+						"name": "Image",
+						"uuid": "de9588ea-da5f-4f33-a686-6db277050c5d",
+						"componentName": "Image",
 						"viewType": "Element",
 						"properties": {
 							"style": {
@@ -93,10 +93,11 @@
 								"left": 0,
 								"top": 0,
 								"position": "absolute",
-								"transformOrigin": "0px 0px 0px",
-								"backgroundColor": "blue"
+								"transformOrigin": "0px 0px 0px"
+							},
+							"attrs": {
+								"source": "asset://eb602b5e-fd36-4968-bed0-ec786cd8e1c0"
 							},
-							"attrs": {},
 							"className": ""
 						},
 						"rect": {
@@ -110,7 +111,14 @@
 			}
 		]
 	},
-	"assets": [],
+	"assets": [
+		{
+			"name": "资源",
+			"ext": ".png",
+			"url": "//yun.duiba.com.cn/spark-prod/assets/资源.7ec4dc0a776a20da7e58e0cee4fab560dea0ec76.png",
+			"uuid": "eb602b5e-fd36-4968-bed0-ec786cd8e1c0"
+		}
+	],
 	"dependencies": {
 		"duiba-api": "0.0.1",
 		"log": "0.0.1"

package.json

@@ -4,6 +4,6 @@
     "main": "",
     "license": "MIT",
     "dependencies": {
-        "@tbminiapp/lottie-miniapp": "0.0.3"
+        "@tbmp/mp-cloud-sdk": "^1.3.8"
     }
 }

project/src/components/comrulepanel/comrulepanel.jsx

@@ -13,9 +13,9 @@ class Comrulepanel extends Component {
   render() {
     return (
       <div className="rulepanel">
-        <div className="rulepanelinner" />
+        <img className="image" src={this.state.resList['eb602b5e-fd36-4968-bed0-ec786cd8e1c0'].url} />
       </div>
     );
   }
 }
-export default Comrulepanel;
+export default Comrulepanel;
\ No newline at end of file

project/src/components/comrulepanel/comrulepanel.less

 .rulepanel {
-  top: 0px;
-  left: 0px;
-  width: 750px;
-  height: 1624px;
-  display: block;
-  position: absolute;
-  .rulepanelinner {
-    width: 300px;
-    height: 300px;
-    opacity: 1;
-    display: block;
-    left: 0px;
     top: 0px;
+    left: 0px;
+    width: 750px;
+    height: 1624px;
+    display: block;
     position: absolute;
-    transform-origin: 0px 0px 0px;
-    background-color: blue;
-  }
-}
+    .image {
+      width: 300px;
+      height: 300px;
+      opacity: 1;
+      display: block;
+      left: 0px;
+      top: 0px;
+      position: absolute;
+      transform-origin: 0px 0px 0px;
+    }
+  }
\ No newline at end of file

project/src/pages/pagefrontpage/pagefrontpage.jsx

@@ -7,16 +7,17 @@ import resList from '../../resconfig/resList';
 import './pagefrontpage.less';
 
 class Pagefrontpage extends Component {
-constructor(props) {
-super(props);
-this.state = this.state || { resList: resList };
+  constructor(props) {
+    super(props);
+    this.state = this.state || { resList: resList };
+  }
+  render() {
+    return (
+      <div className="frontpage">
+        <div className="div" />
+        <img className="image" src={this.state.resList['eb602b5e-fd36-4968-bed0-ec786cd8e1c0'].url} />
+      </div>
+    );
+  }
 }
-render() {
-return (
+export default Pagefrontpage;
\ No newline at end of file
-<div className="frontpage">
-<div className="div" />
-</div>
-);
-}
-}
-export default Pagefrontpage;

project/src/pages/pagefrontpage/pagefrontpage.less

 .frontpage {
-top: 0px;
-left: 0px;
-width: 750px;
-height: 1624px;
-display: block;
-position: absolute;
-.div {
-width: 300px;
-height: 300px;
-opacity: 1;
-display: block;
-left: 0px;
-top: 0px;
-position: absolute;
-background-color: #ff6600;
-}
-}
+    width: 750px;
+    height: 1624px;
+    display: block;
+    position: absolute;
+    transform-origin: 0px 0px 0px;
+    left: 228px;
+    top: 146px;
+    .div {
+      width: 300px;
+      height: 300px;
+      opacity: 1;
+      display: block;
+      position: absolute;
+      background-color: #ff6600;
+      transform-origin: 0px 0px 0px;
+      top: 278px;
+      left: -142;
+    }
+    .image {
+      width: 276px;
+      height: 275px;
+      opacity: 1;
+      display: block;
+      position: absolute;
+      transform-origin: 0px 0px 0px;
+      left: -184;
+      top: -134;
+    }
+  }
\ No newline at end of file

project/src/resconfig/resList.js

-const resList = {};
-export default resList;
+const resList = {
+    'eb602b5e-fd36-4968-bed0-ec786cd8e1c0': {
+      name: '资源',
+      ext: '.png',
+      url: '//yun.duiba.com.cn/spark-prod/assets/资源.7ec4dc0a776a20da7e58e0cee4fab560dea0ec76.png',
+      uuid: 'eb602b5e-fd36-4968-bed0-ec786cd8e1c0'
+    }
+  };
+  export default resList;
\ No newline at end of file