文档章节

前端那些事之react篇实现登录(前后台分离)

上官清偌
 上官清偌
发布于 2017/05/04 18:34
字数 341
阅读 165
收藏 1

1.下载脚手架

  • 安装顺序:npm install -g create-react-app
  • create-react-app my-app(可以在指定的目录下创建)
  • cd my-app/
  • npm start

2.下载路由

  • 指定版本:先安装 npm install --save react-router@3.0.0
  • 最新版本4.1.1跳转不过去

3.下载antd desin

  • npm install antd --save

4.react-redux

  • npm install --save react-redux
  • npm install --save redux

5. ajax请求用插件superagent来实现

简介:SuperAgent 是一个轻量的Ajax API,服务器端(Node.js)客户端(浏览器端)均可使用,SuperAgent具有学习曲线低、使用简单、可读性好的特点,可作为客户端请求代理模块使用,当你想处理get,post,put,delete,head请求时,可以考虑使用SuperAgent。

下载命令:npm install superagent --save

react 实现异步调用redux-thunk

import React from 'react';
import ReactDom from 'react-dom';
//导入路由组件
import Router from './rotuer/index';
import {createStore,combineReducers,applyMiddleware,compose} from 'redux';
import {Provider,connect} from 'react-redux';
import reducer from './reducer/index';
import thunk from 'redux-thunk'
//创建一个全局变量
const store =createStore(reducer,compose(
    //发送异步请求
    applyMiddleware(thunk),
    //可以使用redux在chorme浏览器中调试
    window.devToolsExtension()
))
const Logo=React.createClass({
    render(){
        return(
            <div>
                <Provider store={store}>
                   <Router/>
                </Provider>
            </div>
        )
    },
    //组件加载完成
    componentDidMount(){

    }
})
export default Logo;

© 著作权归作者所有

共有 人打赏支持
上官清偌
粉丝 11
博文 87
码字总数 123671
作品 0
浦东
程序员
私信 提问
前后端分离 | 关于登录状态那些事

背景 登录是一个网站最基础的功能。有人说它很简单,其实不然,登录逻辑很简单,但涉及知识点比较多,如: 密码加密、cookie、session、token、JWT等。 我们看一下传统的做法,前后端统一在一...

小忽悠
10/12
0
0
openresty 前端开发序

还记得第一次尝试前后端分离的时候,是使用nginx + react 构建的spa应用,后端是java,主要处理业务逻辑逻辑部分,返回json数据,在nginx里面配置好html + js纯静态文件,再通过反向代理到j...

-外星人-
2016/12/09
830
0
基于VUE自定义指令实现按钮级权限控制

前言:关于权限的那些事!!! 路由权限可参看这位大神写的,很全面==>手摸手,带你用vue撸后台 系列二(登录权限篇) 思路: 登录:当用户填写完账号和密码后向服务端验证是否正确,验证通过之...

lixinchao
05/23
0
0
Spring Boot + Vue前后端分离开发实战

前后端分离是一种开发方式,已经变得越来越流行了,越来越多的企业都开始往这个方向靠拢。那么,为什么要选择前后端分离呢?前后端分离对实际开发有什么好处呢? 前后端分离可以让专人做专事,...

尹吉欢
06/10
0
0
前后端都要写的一些问题。

介绍:主要是写后台的,但是公司没做前端的,只能自己写前端,前期直接下的jquery一些后台管理模板来搞。一般技术栈是intellijidea里面前后端代码都放在一起,当然也可以前后端分离。后面发现...

码农N号
09/11
442
10

没有更多内容

加载失败,请刷新页面

加载更多

CentOS配置Tomcat监听80端口,虚拟主机

Tomcat更改默认端口为80 更改的配置文件是: /usr/local/tomcat/conf/server.xml [root@test-a ~]# vim /usr/local/tomcat/conf/server.xml # 找到 Connector port="8080" protocol="HTTP/1......

野雪球
今天
5
0
《稻盛和夫经营学》读后感心得体会3180字范文

《稻盛和夫经营学》读后感心得体会3180字范文: 一代日本经营之圣稻盛和夫凭借刻苦勤奋的精神以及深植于佛教的商业道德准则,成为了“佛系”企业家的代表人物。在《稻盛和夫经营学》“领导人...

原创小博客
今天
3
0
java框架学习日志-5(常见的依赖注入)

依赖注入(dependency injection) 之前提到控制反转(Inversion of Control)也叫依赖注入,它们其实是一个东西,只是看的角度不同,这章详细说一下依赖注入。 依赖——指bean对象创建依赖于...

白话
今天
4
0
红外接收器驱动开发

背景:使用系统的红外遥控软件没有反应,然后以为自己接线错误,反复测试,结果烧坏了一个红外接收器,信号主板没有问题。所以自己开发了一个红外接收器的python驱动。接线参见https://my.os...

mbzhong
今天
2
0
ActiveMQ消息传送机制以及ACK机制详解

AcitveMQ是作为一种消息存储和分发组件,涉及到client与broker端数据交互的方方面面,它不仅要担保消息的存储安全性,还要提供额外的手段来确保消息的分发是可靠的。 一. ActiveMQ消息传送机...

watermelon11
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部