Merge pull request #168 from 1921622004/master

fix: render method return array

packages/omi/examples/render-array/main.js

@@ -3,23 +3,27 @@ import { tag, render, WeElement } from '../../src/omi'
 @tag('hello-element')
 class HelloElement extends WeElement {
   render(props) {
-    const { count } = props
-    return [<div>Hello</div>, <div>Element</div>, <div>{count}</div>]
+    const { count, num } = props
+    return [<div>Hello</div>, <div>Element</div>, <div>{count}</div>,<div>{num}</div>]
   }
 }
 
 @tag('my-app')
 class MyApp extends WeElement {
   data = {
-    count: 1
+    count: 1,
+    list:[0]
   }
   render() {
-    return [<hello-element />, <hello-element />, <div>abc</div>]
+    this.data.map((item,index) => {
+      return <hello-element key={index} num={item}/>
+    })
   }
 
   installed() {
-    setInterval(() => {
-      this.data.count++
+    setTimeout(() => {
+      this.data.count++;
+      this.data.list.push(1);
       this.update()
     })
   }

packages/omi/src/vdom/diff.js

@@ -36,10 +36,13 @@ export function diff(dom, vnode, context, mountAll, parent, componentRoot) {
     ret = []
     let parentNode = null
     if (isArray(dom)) {
-      parentNode = dom[0].parentNode
-      dom.forEach(function(item, index) {
-        ret.push(idiff(item, vnode[index], context, mountAll, componentRoot))
-      })
+      var domLength = dom.length;
+      var vnodeLength = vnode.length;
+      var maxLength = domLength >= vnodeLength ? domLength : vnodeLength;
+      parentNode = dom[0].parentNode;
+      for(var i = 0; i < maxLength ; i++){
+          ret.push(idiff(dom[i],vnode[i],context,mountAll,componentRoot));
+      }
     } else {
       vnode.forEach(function(item) {
         ret.push(idiff(dom, item, context, mountAll, componentRoot))
@@ -71,7 +74,7 @@ export function diff(dom, vnode, context, mountAll, parent, componentRoot) {
 
 /** Internals of `diff()`, separated to allow bypassing diffLevel / mount flushing. */
 function idiff(dom, vnode, context, mountAll, componentRoot) {
-  if (dom && dom.props) {
+  if (dom && vnode && dom.props) {
     dom.props.children = vnode.children
   }
   let out = dom,

packages/omi/src/we-element.js

@@ -27,7 +27,7 @@ export default class WeElement extends HTMLElement {
       }
     }
 
-    this.install()
+    !this._isInstalled && this.install()
     let shadowRoot
     if (!this.shadowRoot) {
       shadowRoot = this.attachShadow({
@@ -42,7 +42,7 @@ export default class WeElement extends HTMLElement {
     }
 
     this.css && shadowRoot.appendChild(cssToDom(this.css()))
-    this.beforeRender()
+    !this._isInstalled && this.beforeRender()
     options.afterInstall && options.afterInstall(this)
     if (this.constructor.observe) {
       proxyUpdate(this)
@@ -65,7 +65,7 @@ export default class WeElement extends HTMLElement {
     } else {
       shadowRoot.appendChild(this.host)
     }
-    this.installed()
+    !this._isInstalled && this.installed()
     this._isInstalled = true
   }