Question

这是我与ReactJS的第一个项目，我试图制作我的第一个应用程序 - 计算器。现在在我的项目中，我应该看到我在代码中编写的所有数字和运算符，但我无法看到它们。我哪里弄错了？我不知道它为什么不起作用。我必须在这个问题上写一些更多细节，所以我会用这句话来写这个问题的更多文字！

我的项目：

＆＃13;

 var Calculator = React.createClass({

    getInitialState:function(){
      return {
        math:[
          ["C","/","*","-"],
          [7,8,9,"+"],
          [4,5,6,"+"],
          [1,2,3,"="],
          [0,".","="]
        ]
      }
    },

    render:function(){
      return (
          <div id="calculator"> 
          <div id="result"></div>
          <div id="mathtable">
            {this.state.math.map(function(row){
              var mutants = row.map(function(operand){
                return (
                  <div className="numoperam" >{operand}</div>
                )
              })
              return (
                <div className="rows" >
                  {mutants}
                  </div>
              )
            })}
      </div>
        </div>
      )
    }
  })

  ReactDOM.render(<Calculator/>,document.getElementById("space"))

＆＃13;

@import url('https://fonts.googleapis.com/css?family=Roboto');
body {
  background: blue;
  font-family: "Roboto";
}

#space {
  width: 50vw;
  height: 80vh;
  margin-left: 25vw;
  background: red;
}

#calculator {
  width: 100%;
  height: 100%;
}

#calculator>div {
  width: 100%;
}

#result {
  height: 20vh;
}

#mathtable {
  height: 60vh;
}

.rows {
  width: 100%;
  height: 25%;
}

.rows>div {
  float: left;
  height: 100%;
  width: 25%;
}

.numoperam {}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<body>
  <div id="space"></div>
</body>

＆＃13;

初学者计算器 - ReactJS

0 个答案: