Vueはボトムクエリ関数を実装します

Vueはボトムクエリ関数を実装します

この記事では、ボトムクエリ機能を実装するためのVueの具体的なコードを例として紹介します。具体的な内容は次のとおりです。

1. vant-list コンポーネントの使用に関する関連内容は次のとおりです。

2. オブジェクトバインディング値のデフォルト値:

3. クエリ方法:

完全なコード:

メソッド: {
    取得データ() {
      ステータスを3にします。
      this.queryParams.params={
        ステータス:ステータス、
        パスファクトリー: this.$store.state.user.werksName 
      }
      params = JSON.parse(JSON.stringify(this.queryParams)) とします。
      api.getPageList(params).then((res) => {
        (res.成功)の場合{
          this.dataList = res.data.content;
        } それ以外 {
          トースト.失敗({
            メッセージ:res.msg
          });
        }
      });
    },
     onLoad(){//下部クエリ this.queryParams.page += 1; 
      _this = this とします。
      ステータスを3にします。
      this.queryParams.params={
        ステータス:ステータス、
        パスファクトリー: this.$store.state.user.werksName 
      }
      params = JSON.parse(JSON.stringify(this.queryParams)) とします。
      api.getPageList(params).then((res) => {
       if(res.success){
          this.dataList = this.dataList.concat(res.data.content);
          if (this.dataList.length >= res.data.totalElements) {
            this.finished = true;
          } それ以外 {
            this.finished = false;
          }
          this.loading = false;
        }
      });
    },

以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。

以下もご興味があるかもしれません:
  • Vue 入力ボックスのファジークエリのサンプルコード
  • VueはInput入力ボックスのファジークエリメソッドを実装します
  • Vue.jsはページングクエリ機能を実装します
  • Vueは時間をクリックして期間クエリを取得する機能を実装します
  • Vue.js でのクエリ操作の詳細な例
  • Vue.js フレームワークを使用して列車チケット検索システムを実装する (ソースコード付き)
  • vue.js をベースにページングクエリ機能を実装する
  • Bootstrap4 + Vue2 を使用してページング クエリを実装するサンプル コード
  • Vue2 フィルター ファジー クエリ メソッド
  • Vueは入力ボックスのファジークエリのサンプルコードを実装します(スロットリング機能の適用シナリオ)

<<:  サーバー上でjupyterノートブックを実行する問題を解決する

>>:  複数のdiv内のテーブルのtdwidth設定は同じで、揃えることができません

推薦する

htmlはハイパーリンク付きの新しいウィンドウを開き、ウィンドウのプロパティを制御できます。

1. HTMLハイパーリンクによって開かれるウィンドウのサイズコードをコピーコードは次のとおりです...

SQL の左結合と右結合の原理と例の分析

テーブルが 2 つあり、テーブル A のレコードがテーブル B に存在しない可能性があります。左結合...

mysql5.7 でユーザーの初期パスワードを変更する方法

ユーザーが初めて MySQL データベースをインストールするとき、初期のルート パスワードを変更する...

Google Chromeの自動入力問題に対する完璧な解決策

Google Chrome では、ログインに成功すると、パスワードを記憶するかどうかを尋ねるメッセー...

ページのレンダリング時間を短縮してページの実行速度を速めます

ブラウザでのページのレンダリング時間をできるだけ短縮するにはどうすればよいでしょうか? この記事は、...

つまり、フィルターコレクション

IE は開発の初期段階では頭を悩ませましたが、他のブラウザとは異なります。他のブラウザがサポートして...

基礎知識: ウェブサイトのアドレスの前の http はどういう意味ですか?

HTTPとは何ですか?ウェブサイトを閲覧したいときは、ブラウザのアドレス バーにウェブサイトのアド...

CSS3 アドバンス LESS で星空アニメーションを実装するサンプルコード

この記事では、星空アニメーションを実現するための高度な CSS3 LESS のサンプルコードを次のよ...

k8sとDockerの関係についての簡単な説明

最近、プロジェクトでは kubernetes (以下、k8s と表記、k と s の間には 8 つの...

Dockerコンテナ同士を接続する3つの方法の詳しい説明

Docker コンテナ間の相互接続と通信には 3 つの方法があります。 Docker 内部ネットワー...

HTML独習の旅(I)基本要素と属性の練習(自分でコードを書く)

私は W3school のチュートリアルに従いました。チュートリアルはとても良いと思います。各セクシ...

MySQLの3つの用途と違いは同等ではない

MySQLでは判定記号がよく使われますが、等しくない記号はもっと一般的に使われます。次の3つの等しく...

Linux ドメイン ネーム サービス DNS 設定方法

DNSとはDNS の正式名称は Domain Name System で、ドメイン名解決システムを意...

Docker swarm の簡単なチュートリアル

3つの仮想マシン132、133、134を群がらせる1. クラスターを初期化し、自分自身をクラスターに...

VMware マルチノード環境を構成する方法

このチュートリアルでは CentOS 7 64 ビットを使用します。各仮想マシンに 2GB のメモリ...