React material UI 警告选项卡只接受选项卡组件作为子项

Question

我正在使用 material UI 选项卡。但出于某种原因，我得到

警告：选项卡只接受选项卡组件作为子项。

Found function (props, context, updater) {
  // This constructor gets overridden by mocks. The argument is used
  // by mocks to assert on what gets mounted.

  if (process.env.NODE_ENV !== 'production') {
    process.env.NODE_ENV !== 'production' ? warning(this instanceof Constructor, 'Something is calling a React component directly. Use a factory or ' + 'JSX instead. See: fb.me/react-legacyfactory') : void 0;


// Wire up auto-binding
  if (this.__reactAutoBindPairs.length) {
    bindAutoBindMethods(this);
  }

  this.props = props;
  this.context = context;
  this.refs = emptyObject;
  this.updater = updater || ReactNoopUpdateQueue;

  this.state = null;

我正面临这个警告

我的代码是这样的

return (
     <MuiThemeProvider>
        <div className="background">
            <Header/>
                    <div className="container">
                        <Tabs>
                            <Tab label="Profile" onActive={this.Profile.bind(this)}>
                                <div>
                                    <Profile/>
                             //this is children class
                                </div>
                            </Tab>

                            <Tab label="Downloads" >
                                <div>
                                    {
                                        data.map((detail)=> {
                                            return <DataContainer item={detail}
                                                              ViewItem = {this.productData.bind(this)}
                                            />
                                        })
                                    }

                                </div>
                            </Tab>
                            <Link to="ItemPreview"> <Tab label="Content">
                            </Tab></Link>
                        </Tabs>
                    </div>
            <Sidebar productname={productspecificdata}/>
        </div>
      </MuiThemeProvider>

Answer 1

您需要从此选项卡中删除 Link 标签

<Link to="ItemPreview"> <Tab label="Content"></Tab></Link>

正如警告所说，您不能在选项卡下直接放置 Link 标签。如果需要，请尝试在选项卡内添加 link。

很多Material-Ui组件都有这个behaviour/constraint，我记得Table也有。

React material UI 警告选项卡只接受选项卡组件作为子项

React material UI WARNING Tabs only accepts Tab Components as children

reactjs

material-ui