javascript - 如何扩展Material-UI组件

我想像这样用 es6类扩展选项卡组件:

import React from "react";

import {Tab} from "material-ui";

class MyTab extends Tab {
    constructor(props){
        super(props);
    }

    render(){
        return super.render();
    }

}

export default MyTab;

但我得到一个错误:

Uncaught TypeError: Cannot read property 'muiTheme' of undefined

我究竟做错了什么？

最佳答案

扩展MUI组件的正确方法是使用其withStyles() higher-order component Design Approach

import React, { Component } from "react";
import Tab from "@material-ui/core/Tab";
import { withStyles } from "@material-ui/core/styles";

const styles = theme => {
  return ({
      myTab: {
        fontFamily: 'Courier New',
    });
}

class MyTab extends Component {

  render() {
    return (
      const {classes, ...other} = this.props
      <Tab {...other} className={classes.myTab} label="Home" />
   }
}

export default withStyles(styles)(MyTab);

关于javascript - 如何扩展Material-UI组件，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35335586/