我正在嘗試在 React 中創建一個盒子，但它不起作用

Question

這是我的代碼：

   class Landing extends Component {
  state = {
    box: " width: 300px , height: 100px, border: 1px solid blue; ",
  };


  render() {
    return <div className={this.state.box}>Hello</div>;
  }
}

這個想法是“你好”應該在一個盒子里。

相反，我得到的是一個沒有框的 web 頁面，只有一個你好。

請幫忙。

Answer 1

將className更改為style ，並將box in 變為真實的 object。

class Landing extends Component {
  state = {
    box: {width: '300px', height: '100px', border: '1px solid blue'},
  };


  render() {
    return <div style={this.state.box}>Hello</div>;
  }
}