正文

请到「今天看啥」查看全文

来源于: {props.title}

);

export default NavBar;

当然, 也可以开添加一些公共样式, 这样在每个组件内都可以使用, 修改/src/index.css:

body {

margin: 0;

padding: 0;

font-family: sans-serif;

background-color: #f5f5f5;

}

.content {

margin: 0;

padding: 20px;

font-size: 18px;

background-color: #fff;

border-bottom: 1px solid #e5e5e5;

}

因为 index.css 在 index.js 中引入了, 我们在其他组件中不用引用, 直接使用就好啦, 修改关于组件/src/components/About/About.js:

import React from 'react';

import NavBar from '../Common/NavBar';

const About = () => (

这是关于页

);

export default About;

其他组件的修改也是一样的, 即在组件中给 className 贬值为样式名即可;

现在命令行切到项目根目录, 执行yarn run start启动项目, 在浏览器内查看添加样式后的效果;

从服务端获取数据

这里使用的 axios来获取数据, 先安装包:

$ yarn add axios

下面的实例演示一下

在src目录内创建一个service的目录, 并创建一个 Connect.js 的文件:

import React, { Component } from 'react';

import axios from 'axios';

const Connect = (MyComponent) => {

return class extends Component {

constructor(props) {

请到「今天看啥」查看全文