re quests

pencarian ulang

Jaringan Deklaratif untuk React.

Mulai Cepat

1. Instal dengan NPM (atau Yarn)

 npm install --save re-quests

2. Jalankan permintaan jaringan dengan merender Request .

 import Request from 're-quests' ;

...
render (
    < Request
        url = 'https://my-awesome-doma.in/me'
        onSuccess = { this . myAwesomeResponseHandler } >
    
        < div > { /* use View for react-native */ }
            < Request . Start >
                < MyAwesomeSpinner />
            </ Request . Start >
            < Request . Success >
                < MyAwesomeContent content = { this . state . content } />
            </ Request . Success >
            < Request . Failure >
                < MyAwesomeErrorMessage />
            </ Request . Failure >
        </ div >
    </ Request >
)

3. Tangani respons sesuai keinginan Anda.

 myAwesomeResponseHandler = ( response ) => {
    // set a local state
    this . setState ( {
        content : response . data
    } ) ;
    
    // or dispatch an event
    // this.props.dispatch(myAwesomeAction(response.data));
} 

Resep

Untuk masalah sehari-hari & caranya, lihat halaman Resep.

Penyingkapan

Perpustakaan yang digunakan untuk mengirim permintaan adalah aksio. Komponen Request hanyalah pembungkus deklaratif di sekitarnya, memperlihatkan beberapa kemampuan aksio.

Alat peraga

 // `url` is the server URL that will be used for the request
url: PropTypes . string . isRequired ,

// the http method is not required by axios &
// defaults to 'get' if not provided
method : PropTypes . oneOf ( [ 'get' , 'post' , 'put' , 'patch' , 'delete' , 'head' ] ) ,

// `headers` are custom headers to be sent
headers : PropTypes . object ,

// `params` are the URL parameters to be sent with the request
// Must be a plain object or a URLSearchParams object
params : PropTypes . object ,

// `data` is the data to be sent as the request body
// Only applicable for request methods 'PUT', 'POST', and 'PATCH'
// When no `transformRequest` is set, must be of one of the following types:
// - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
// - Browser only: FormData, File, Blob
// - Node only: Stream
data : PropTypes . oneOfType ( [
    PropTypes . string ,
    PropTypes . object ,
    PropTypes . instanceOf ( ArrayBuffer ) ,
    PropTypes . instanceOf ( ArrayBufferView ) ,
    PropTypes . instanceOf ( URLSearchParams )
] ) ,

// `paramsSerializer` is an optional function in charge of serializing `params`
// (e.g. https://www.npmjs.com/package/qs, http://api.jquery.com/jquery.param/)
// default: function(params) { return Qs.stringify(params, {arrayFormat: 'brackets'}) }
paramsSerializer : PropTypes . func ,

// `transformRequest` allows changes to the request data before it is sent to the server
// This is only applicable for request methods 'PUT', 'POST', and 'PATCH'
// The last function in the array must return a string, an ArrayBuffer, FormData, or a Stream
transformRequest : PropTypes . arrayOf ( PropTypes . func ) ,

// `transformResponse` allows changes to the response data to be made before
// it is passed to then/catch
transformResponse : PropTypes . arrayOf ( PropTypes . func ) ,

// `validateStatus` defines whether to resolve or reject the promise for a given
// HTTP response status code. If `validateStatus` returns `true` (or is set to `null`
// or `undefined`), the promise will be resolved; otherwise, the promise will be
// rejected.
// default: function (status) { return status >= 200 && status < 300; }
validateStatus : PropTypes . func ,

// `maxRedirects` defines the maximum number of redirects to follow in node.js.
// If set to 0, no redirects will be followed.
// default: 5
maxRedirects : PropTypes . number ,

// `timeout` specifies the number of milliseconds before the request times out.
// If the request takes longer than `timeout`, the request will be aborted.
timeout : PropTypes . number ,

// `auth` indicates that HTTP Basic auth should be used, and supplies credentials.
// This will set an `Authorization` header, overwriting any existing
// `Authorization` custom headers you have set using `headers`.
// { username: 'janedoe', password: 's00pers3cret' }
auth : PropTypes . shape ( {
    username : PropTypes . string ,
    password : PropTypes . string
} ) ,

// `responseType` indicates the type of data that the server will respond with
// options are 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream'
// default: json
responseType : PropTypes . oneOf ( [ 'arraybuffer' , 'blob' , 'document' , 'json' , 'text' , 'stream' ] ) ,

// `xsrfCookieName` is the name of the cookie to use as a value for xsrf token
// default: 'XSRF-TOKEN'
xsrfCookieName : PropTypes . string ,

// `xsrfHeaderName` is the name of the http header that carries the xsrf token value
// default: 'X-XSRF-TOKEN'
xsrfHeaderName : PropTypes . string ,


// callback fired just before the request is fired
onStart : PropTypes . func ,

// callback fired after the response 
// comes back with status 2XX
onSuccess : PropTypes . func ,

// callback fired after the response 
// comes back with status other 2XX
onFailure : PropTypes . func ,

// callback fired when 
// something else goes wrong
onError : PropTypes . func ,

// defer signals the Request component to not fire the 
// request as soon as ready instead construct the request and 
// wait for the manual trigger
// useful for cases when either the data is incomplete 
// or we want to wait for a CTA 
defer : PropTypes . bool ,

// request can be tagged for enabling nested scenarios
// we might want to render a component based on 
// request sent way above the hierarchy of the component
// super grand parent component :P
tag : PropTypes . string 

Keterbatasan

• Semua komponen re-quests hanya dapat memiliki satu turunan langsung. Sama seperti render yang hanya dapat mengembalikan satu anak. Ini akan diperbaiki dengan reaksi 16.

Kontribusi

Setiap dan seluruh kontribusi diterima, asalkan sejalan dengan kepentingan proyek. Harap pastikan pesan komit mengikuti konvensi dari templat git commit.