老师这个警告是怎么回事

老师这个警告是怎么回事

http://img1.sycdn.imooc.com//climg/60fa04d309e832e912850816.jpg

import React , { Component,Fragment} from 'react';
import logo from './logo.png';
import './header.css';
import { Menu, Icon } from 'antd';

class AppHeader extends Component {

constructor(props){
super(props);
this.state = {
list:[{
id:1,
icon:"mail",
title:"VOA慢速英语"
},{
id:2,
icon:"mail",
title:"VOA慢速英语"
},{
id:3,
icon:"mail",
title:"VOA慢速英语"
},{
id:4,
icon:"mail",
title:"VOA慢速英语"
},{
id:5,
icon:"mail",
title:"VOA慢速英语"
},{
id:6,
icon:"mail",
title:"VOA慢速英语"
}]
}
}

getMenuItems(){
return this.state.list.map(item =>{
return(
<Menu.Item key={item.id}>
<Icon type={item.icon} />{item.title}
</Menu.Item>
)
})
}

render(){
return(
<Fragment>
<img src={logo} className='app-header-logo'/>
<Menu mode="horizontal" className='app-header-menu'>
{this.getMenuItems()}
</Menu>

</Fragment>
)
}
}

export default AppHeader;
​import React, { Component } from  'react';
import ReactDom from 'react-dom';
import 'antd/dist/antd.css';
import { Layout } from 'antd';
import './style.css';
import AppHeader from './components/Header';

const { Header, Footer, Content } = Layout;

class App extends Component {
render(){
return(
<Layout style={{ minWidth : 1300 }}>

<Header className="header">
<AppHeader></AppHeader>
</Header>
<Content className="content">Content</Content>
<Footer className="footer">Footer</Footer>
</Layout>
)
}
}




ReactDom.render(<App/>,document.getElementById('root'));


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
好帮手慕言 2021-07-23 11:24:22

同学你好,如下:

1、第一个警告是提示componentWillReceiveProps生命周期改名了,不过componentWillReceiveProps还是可以正常使用的,不用担心。

2、第二个看提示是antd的警告,猜测可能和版本有关系。

3、第三个提示img要加上alt属性,同学可以加上之后再测试下。

项目出现警告是正常的,只要不影响项目的运行就可以。

祝学习愉快~

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师