资料内容:
源码实现
这里只列出一些关键代码,供演示用,其它的文件代码可参考原码中描述,不再详细说明了。 Logo.js实现
import React from 'react';
class Logo extends React.Component {
render() {
return <div className="Logo"/>;
}
}
export default Logo
Logo.css实现
.Logo {
background: purple url('../../images/whinepad-logo.png');
background-size: cover;
display: inline-block;
height: 60px;
vertical-align: middle;
width: 100px;
}
app.js实现
'use strict';
import Logo from './components/Logo';
import React from 'react';
import ReactDOM from 'react-dom';
ReactDOM.render(
<div>
<h1>
<Logo/> Welcome to Whinepad!
</h1>
</div>,
document.getElementById('pad')
);