axios でパラメータを渡す 2 つの方法について詳しく説明した記事

axios http リクエスト ライブラリを送信するために クライアント または サーバー のいずれかに使用できることは誰もがよく知っています。 。ただし、フロントエンドとバックエンドを共同でデバッグする場合、不快な場合があるため、ここでまとめておきます。運命の人のお役に立てれば幸いです。

パラメータの受け渡し方法 [関連する推奨事項: vue.js ビデオ チュートリアル ]

パラメータを渡す方法は通常 2 つあります。1 つは次の方法です。 params、もう 1 つは data メソッドです。多くの場合、フロントエンド コードは次のようになります

get request

axios({
    method: 'GET',
    url: 'xxxxx',
    params: param,
  })
或者 
axios({
    method: 'GET',
    url: '/xxx?message=' + msg,
  })

post request

axios({
    method: 'POST',
    url: '/xxxxx',
    data: param,
  })
  或者
 axios({
    method: 'POST',
    url: '/xxxxx',
    params: param,
  })

正しい配信

パラメータを渡す解決方法はpostとgetに分かれていますので、ここから見ていきましょう

<span style="background-color:#cccccc;">post</span>

post ほとんどの人が誤解します。一見。

<span style="background-color:#cccccc;">data</span> フォーム

この例で言えば、使用されるケース コードは post パラメーターです。トランスコーディングは行われません。

method: 'POST',
    url: '/xxxxx',
    data: param,
  })

コンソールの結果

データを使用して渡されるのはオブジェクトであり、 console 単語は request payload

##node バックグラウンドでパラメータを受け取る方法

ここでは、

koa によって構築されたバックエンドを使用します。 body<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">import Koa from 'koa'; import bodyParser from 'koa-bodyparser' const app = new Koa(); app.use(bodyParser()); app.listen(9020, () =&gt; {   console.log('the server is listen 9020 port'); })</pre><div class="contentsignin">ログイン後にコピー</div></div> のパラメータを解析するには、

koa-bodyparser

プラグインを使用する必要があります。受け入れ方法は次のとおりです。

java バックグラウンドでパラメータを受け取る方法

私は Java に詳しくありませんが、知っています。

data で渡された axios パラメータを受け入れる必要がある場合。注釈 @responseBody を使用し、エンティティ クラスを使用してそれを受け取る必要があります。

投稿データ フォームでは、サーバー側の言語に関係なく、パラメータは body から取得する必要があります。主にオブジェクトパラメータを渡すために使用され、バックグラウンドで取得されるデータは obj です。データ形式のデータは、ファイルのアップロード、フォームの送信など、さまざまな機能を実行できます。

params フォーム

これはオブジェクトの形式で渡されます。ケースコードは次のとおりです:

#

 axios({
    method: 'POST',
    url: '/xxxxx',
    params: param,
  })

ブラウザ結果分析

#ビュー ソースを次のように表示します:

node

バックグラウンドでパラメータを受け取る方法

サービスの起動以降は同じですが、パラメータの受け取り方法が少し変更されています

##java 方法バックグラウンドでパラメータを受け取る方法

この人 それができない場合は、理論的にはアドレスバーからパラメータを取得できます。注釈 @resquestParam

get request

get request も使用する必要があります。どのメソッドを使用しても、最後のパラメータはパスに配置されます。 param のみを使用すると、axios はこのパラメータをシリアル化し、URL に結合します。理由がある場合は、次の点を確認してください。

理由は 2 つあります。

この問題が発生した場合は、

のソース コードを確認する必要があります。 axios

。ここではパラメータを扱う部分のみを見ていきます。興味があれば、自分でソースコードを確認してください。

Processingdata

axios

ファイルの

core/dispatchRequest.js

で、 axois が data になることがわかります。

axios の default.js には、特に data## を変換する関数があります。 # パラメトリック。

注: 上記は、パラメータを渡す data の単なる例です。実際、data は、アドレス バーや file Upload などに貼り付けられる場合もあります。たくさんありすぎるので、ここでは使い方だけを説明します。

処理

params

axios ファイルの adapt/ xhr.js で、 axois が params パラメータを url パスに配置することがわかります。

buildUrl いくつかのキーコードは次のとおりです:

概要

実際には、フロントエンドとバックエンド エンドツーエンドの接続パラメータ プロセスで、

post リクエストの場合、data が機能しない場合は、params## を使用します。 # を渡します。うまくいかない場合は、バックエンドに問題がある可能性があります。

以上がaxios でパラメータを渡す 2 つの方法について詳しく説明した記事の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。