我在我的应用程序中遇到了一个来自material-ui的react可滑动标签的问题。我安装并做了文档中推荐的所有事情。现在,我得到了屏幕截图上显示的以下错误。合并来自material-ui的可滑动标签是否有任何问题。因为当我使用受控示例时,它工作正常,没有显示任何错误。
目前我正在使用以下代码:
import React, { Component } from 'react';
import {Tabs, Tab} from 'material-ui/Tabs';
import SwipeableViews from 'react-swipeable-views';
const styles = {
headline: {
fontSize: 24,
paddingTop: 16,
marginBottom: 12,
fontWeight: 400,
},
slide: {
padding: 10,
},
};
export default class ProfileTabSection extends Component {
constructor(props) {
super(props);
this.state = {
slideIndex: 0,
};
this.handleChange = this.handleChange.bind(this);
}
handleChange(value) {
this.setState({
slideIndex: value,
});
};
render() {
return(
<div>
<div className="container-fluid profile-tab-section">
<Tabs
onChange={this.handleTabChange}
value={this.state.slideIndex}
>
<Tab label="Feed" value={0} />
<Tab label="All posts" value={1} />
<Tab label="Followers" value={2} />
<Tab label="Following" value={3} />
</Tabs>
<SwipeableViews
index={this.state.slideIndex}
onChangeIndex={this.handleChange}
>
<div id="feed_slide">
It's a feed slide </div>
<div id="all_posts_slide" style={styles.slide}>
It's an all posts slide!
</div>
<div id="followers_slide" style={styles.slide}>
Followers
</div>
<div id="following_slide" style={styles.slide}>
Following
</div>
</SwipeableViews>
</div>
</div>
);
}
}
2条答案
按热度按时间fjnneemd1#
您应该将代码包含在
导入以下语句
稍后将您的Material-ui组件包含在以下代码中
希望这对你有帮助。
eivgtgni2#
试试看:
1.删除
package-lock.json
和/或yarn.lock
,rm -rf node_modules
,1.运行
npm install
(如果使用的是yarn
,则运行yarn install
),然后1.又是
npm start
。如果这不起作用,请共享您的
package.json