ホームページ  >  記事  >  ウェブフロントエンド  >  Vue は、post で渡されるパラメータが null である問題を解決するために axios コンポーネントを追加します

Vue は、post で渡されるパラメータが null である問題を解決するために axios コンポーネントを追加します

php中世界最好的语言
php中世界最好的语言オリジナル
2018-03-28 14:02:594672ブラウズ

今回はpostで渡されるnullパラメータの問題を解決するためにvueに追加されたaxiosコンポーネントをお届けします注意点は何ですか 以下は実践的なケースです。見てみましょう。

1. axios

npm install axios --save

2. axiosコンポーネントを追加します

3. リクエストを取得します

4、

投稿リクエスト

import axios from 'axios'
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
axios.defaults.baseURL = 'http://localhost:7878/zkview';
Vue.prototype.$ajax = axios;

5. 実行結果:

6. 注: post メソッドを使用する場合、パラメーターを渡す方法は 2 つあり、1 つは通常の方法です。

jsonメソッド、バックグラウンドが通常のメソッドを受け入れる場合は、上記のメソッドを使用します。バックグラウンドでの適切な形成方法

testGet: function () {
 this.$ajax({
  method: 'get',
  url: '/test/greeting',
  params: {
   firstName: 'Fred',
   lastName: 'Flintstone'
  }
 }).then(function (response) {
  console.log(response);
 }).catch(function (error) {
  console.log(error);
 });
},
-Receivingパラメーター:

testPost: function () {
    var params = new URLSearchParams();
    params.append('name', 'hello jdmc你好');
    params.append('id', '2');
    this.$ajax({
     method: 'post',
     url: '/test/greeting2',
     data:params
//     data: {id: '3', name: 'abc'}
    }).then(function (response) {
     console.log(response);
    }).catch(function (error) {
     console.log(error);
    })
   }

jsonMethod

var params = new URLSearchParams();
params.append('name', 'hello jdmc你好');
params.append('id', '2');
data:params

rreeevivingパラメーターこの記事では、よりエキサイティングな情報を入手してください。php 中国語 Web サイトの他の関連記事にも注目してください。

推奨読書:

JS の深いコピーと浅いコピーの使用の詳細な説明

Vue でのメソッドと計算の違い

以上がVue は、post で渡されるパラメータが null である問題を解決するために axios コンポーネントを追加しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。