類型錯誤：Class 擴展值 #<object> 不是反應js中的構造函數或null<div id="text_translate"><p> 我試圖超越一些主要反應按鈕組件的 function，但是在擴展主要反應按鈕組件 class 時出現此錯誤。 這是我的代碼：</p><pre> import { Button } from "primereact/button"; class BtnBox extends Button { constructor(props) { super(props); this.renderLabel = this.renderLabel.bind(this); } renderLabel() { return &lt;span&gt;icon&lt;/span&gt;; } } class IconButton extends React.Component { render() { return ( &lt;div className="icon-button"&gt; &lt;BtnBox {...this.props} /&gt; &lt;/div&gt; ); } } export default IconButton;</pre></div></object>

Question

我試圖超越一些主要反應按鈕組件的 function，但是在擴展主要反應按鈕組件 class 時出現此錯誤。 這是我的代碼：

import { Button } from "primereact/button";
class BtnBox extends Button {
  constructor(props) {
    super(props);
    this.renderLabel = this.renderLabel.bind(this);
  }

  renderLabel() {
      return <span>icon</span>;
  }
}
class IconButton extends React.Component {
  render() {
    return (
      <div className="icon-button">
        <BtnBox {...this.props} />
      </div>
    );
  }
}

export default IconButton;

Answer 1

你可以試試這個表格嗎？

import { Button } from "primereact/button";
     class BtnBox extends Button {
         constructor(props) {
             super(props);
          }
            
         render = () => <span>{this.props.name}</span>;
      }
    
   class IconButton extends React.Component {
      render() {
        return (
          <div className="icon-button">
            <BtnBox name='add item' />
          </div>
        );
      }
    }
    
 export default IconButton;

如果不適合你，你能分享更多細節嗎？