ElementGroup.js

import React from 'react'
import Element from './Element'
import ReactAddonsUpdate from 'react-addons-update'
import autobind from 'autobind-decorator'
import { observer, inject } from 'mobx-react';

@inject(["elementGroupStore"]) @observer
@autobind
export default class ElementGroup extends React.Component {
  cloneElement(element) {
    this.store().cloneElement(element)
  }

  deleteElement(element) {
    this.store().deleteElement(element)
  }

  // 返回element的index为-1, 删除最后一个元素
  deleteLastElement() {
    this.store().deleteLastElement()
  }

  store() {
    return this.props.elementGroupStore
  }

  sidebar() {
    return document.getElementById('sidebar')
  }

  render() {
    return (
      <div>
        {this.store().elements.map(element =>
          (<Element
            meta_element={ element }
            key={ "key_" + element.id }
            id={ element.id }
            name={ element.name }
            initialPos={ element.initialPos }
            target_type={ element.target_type }
            handleCloneElement={ this.cloneElement }
            handleDeleteElement={ this.deleteElement }
            handleDeleteLastElement={ this.deleteLastElement }
          />)
        )}
      </div>
    )
  }
}