2017-02-16 14 views
1

フェッチ関数を区切ったファイルに入れようとしているので、これらのAPIフェッチを簡単に整理できます。しかし、データをフェッチして返すと、nullまたは予期しないjsonオブジェクトが返されます。ここに私のsrcの一部です:React-native async fetchでnullが返される

//api.js 
export async function LoginAPI(username, password) { 
    const url = baseURL + "/login/"; 
    var params = {username: username, password: md5.hex_md5(password)}; 

    let response = await fetch(url, { 
     method: 'POST', 
     headers: {'Accept': 'application/json','Content-Type': 'application/x-www-form-urlencoded'}, 
     body: JSON.stringify(params) 
    }); 
    return await fetch(url, { 
     method: 'POST', 
     headers: header, 
     body: JSON.stringify(params) 
    }) 
    .then((res) => res.text()) 
    .then((text) => text.length ? JSON.parse(text) : {}) 
    .catch((error) => { 
     throw error; 
    }); 
}; 

ここに別のファイルがあります。

//index.js 
var Login = React.createClass({ 
    onPress_login: function() { 
    var value = this.refs.form.getValue(); 
    if (value) { 
    result = LoginAPI(value.username, value.password); 
    console.log(result); 
    } else { 
    this.AlertDialog.openDialog(); 
    } 
}, 
render() { 
    return (
(...) 
<Button onPress={this.onPress_login}> 
    <Text>Login</Text> 
</Button> 

フェッチが機能しており、サーバーと通信しています。しかし、コンソールログは、最初の場所

Promise _45: 0_54: null _65: null _81: 1 __proto__: Object 

で私にこれを返す私は、最初の場所でコンソールのresultログのawait結果(サーバからの実際の応答が、フェッチの目的ではないと仮定しています応答)。私はメソッドをオンラインで検索しようとしましたが、関数呼び出しとしてフェッチを行う方法を示す投稿/ブログ/記事は見つかりません。

速報のようにする方法はありますか?LoginAPI(username, password, callback: {...})してください。

答えて

2

問題は、非同期機能を作成して応答を待っていないことです。そのようなコンソールログが表示されます。

これを試してみてください:

result = await LoginAPI(value.username, value.password); 

これはあなたの問題だった場合、私に教えてください。

+0

これは壊れています...インポートエラーがあります。 – DrKNa

+0

ああいいヒント!この方法で動作します。 'onPress_login:async function(){ var value = this.refs.form.getValue(); if(value){ result = LoginAPI(value.username、value.password)を待つ; – DrKNa

+1

まさに!よくやった :) –

関連する問題