创建一个博客，功能1：登陆功能 --react

react介绍

好像也没有什么可以介绍

代码

引用bootstrap ui库 因为引入了react react-dom react-router 所以需要引入babel编译

main.jsx 代码

var Router = window.ReactRouter.Router;
var Route = window.ReactRouter.Route;
var hashHistory = window.ReactRouter.hashHistory;
var Link = window.ReactRouter.Link;

class Signin extends React.Component {
    constructor(props) {
        super(props);
        this.handleEmailChange = this.handleEmailChange.bind(this);
        this.handlePasswordChange = this.handlePasswordChange.bind(this);
        this.signIn = this.signIn.bind(this)
        this.state = {
            email: '',
            password: ''
        };
    }
    handleEmailChange(e) {
        this.setState({ email: e.target.value })
    }
    handlePasswordChange(e) {
        this.setState({ password: e.target.value })
    }
    signIn() {
        axios.post('/signin', {
            email: this.state.email,
            password: this.state.password
        })
            .then(function (response) {
                console.log(response);
            })
            .catch(function (error) {
                console.log(error);
            });
    }
    render() {
        return (
            

                

                    
 Please sign in 
                    Email address
                    
                    Password
                    
                    Sign in
                
                

                    {'Signup'}
                
            
        )
    }
}

axios.post 是在前面引用这一个库

服务器搭建

const koa = require("koa");
const app = new koa();
const Router = require('koa-router')
const bodyParser = require('koa-bodyparser');
const serve = require('koa-static');
app.use(serve(__dirname + '/html'))
app.use(bodyParser());
app.use( async ( ctx) => {
    if(ctx.url == '/signin'&& ctx.method =='POST'){
        console.log()
        var user_name=ctx.request.body.email;
        var password=ctx.request.body.password;
            if(user_name==='admin'&&password===“admin”){
                ctx.body = 'Success';
            }
            else{
             ctx.body = 'Wrong username password';
            }
    }
  })
app.listen(7777,function(){
    console.log("Started listening on port", 7777);
})

使用koa2
koa-router 使用路由
koa-bodyparser 读取parser
koa-static 设置静态文件目录 这个要写在前面 如果写在后面 他可能不是静态的了