Formula组件

ssc-formula

by xx7y7xx

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://npmcdn.com/react@latest/dist/react-with-addons.js"></script>
<script src="https://npmcdn.com/react-dom@latest/dist/react-dom.js"></script>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fi.yonyoucloud.com/css/jquery.treeview.css">
<script src="//cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<script src="https://fi.yonyoucloud.com/common/libs/js/jquery.treeview.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>
<script src="https://unpkg.com/[email protected]/build/Formula.js"></script>


<div id="formula">
    <!-- This element's contents will be replaced with your component. -->
</div>

JavaScript 1.7

var Demo = React.createClass({
  showFormula: function() {
    this.refs.formula.showAlert();
  },
  handleDataBack: function(data) {
    alert(data);
  },
  render: function() {
    return (
      <div>
        <h1>公式编辑器演示</h1>
        <button
          className="btn btn-default"
          onClick={this.showFormula.bind(this)}
        >
          弹出公式编辑器
        </button>
        <Formula
          ref="formula"
          formulaText="abc"
          refItem="dept"
          refText="xxxx"
          eid="fier_bxd"
          backFormula={this.handleDataBack.bind(this)}
        />
      </div>
    );
  }
});

ReactDOM.render(
  <Demo />,
  document.getElementById('formula')
);