对于所有我知道,我必须在行动创建请求。如何使用行动中的承诺来提交请求?我得到的数据在行动。然后在reducer中创建新状态。在连接中绑定动作和缩减器。但我不知道如何使用promise的请求。
行动
import $ from 'jquery';
export const GET_BOOK = 'GET_BOOK';
export default function getBook() {
return {
type: GET_BOOK,data: $.ajax({
method: "GET",url: "/api/data",dataType: "json"
}).success(function(data){
return data;
})
};
}
减速器
import {GET_BOOK} from '../actions/books';
const booksReducer = (state = initialState,action) => {
switch (action.type) {
case GET_BOOK:
return state;
default:
return state;
}
};
export default booksReducer;
容器
如何在容器中显示数据?
import React,{ Component,PropTypes } from 'react';
import { connect } from 'react-redux';
import getBook from '../actions/books';
import Radium from 'radium';
import {Link} from 'react-router';
function mapStateToProps(state) {
return {
books: state.data.books,};
}
function mapDispatchToProps(dispatch) {
return {
getBooks: () => dispatch(getBook()),};
}
@Radium
@connect(mapStateToProps,mapDispatchToProps)
class booksPage extends Component {
static propTypes = {
getBooks: PropTypes.func.isrequired,books: PropTypes.array.isrequired,};
render() {
const {books} = this.props;
return (
All Authors
{books.map((book,index) =>
"{book.name}"
{book.author}
)}
);
}
}
export default booksPage;