vue.jsフィルターは、ネストされたメソッドが実行できないことを実行しますか?

マグナス

vue.jsフィルターがネストされたメソッドでは不可能なことを達成できるかどうか疑問に思っています。vue.jsの初心者としては、実際の目的ではない余分な構文のようです。たとえば、このコードの代わりに、フィルターで定義された「capitalize」関数を使用します。

{{キー| 大文字にする}}

これを書いて、「capitalize」関数を「filters」ではなく「methods」セクションに移動します。

{{capitalize(key)}}

ネストされたメソッドが不十分なユースケースはありますか、それともフィルターは単なるシンタックスシュガーですか?(後者の場合、私の好みには甘くないですが、この質問が私のパレットの開発に役立つことを願っています。)

このコードは、https: //vuejs.org/v2/examples/grid-component.htmlのvue.jsリファレンスからのものです

救いの手

あなたが言ったように、フィルターはjavascript関数に他なりません。

したがって、それらは通常、内部の関数のように定義できmethodsます。

filters異なるロジックを別々の部分に分離し、フレームワークの完全な機能を活用するのが良いので使用することをお勧めします

1つのユースケースは、複数のフィルター/操作を使用する必要がある場合、フィルターがchained内部にあるため、それらが便利になることです。

filters: {
 removespace: function(value) {
   return value.replace(/\s/g, '')
 },
 lowercase: function(value) {
   return value.toUpperCase()
 },
}

<p>{{ message | lowercase | removespace }}</p>

またはbuilt inフィルター(イベント)、

<input v-on="keyup:myFunction | key enter">

<!--myFunction will be called only when the enter key is pressed.-->

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

vue.jsコンポーネントが最初の試行でフェッチされたデータを表示しないのはなぜですか?

分類Dev

vue.jsコンポーネント内からメソッドを実行するにはどうすればよいですか

分類Dev

Vue.jsドロップダウンネストメニュー(子がアクティブなときは親を開いたままにします)

分類Dev

axiosインターセプターハンドラーは、作成されたメソッドがaxios.getを呼び出しているvueコンポーネントインスタンス(このポインター)にどのようにアクセスできますか?

分類Dev

Vue JSで、vueインスタンス内のメソッドからフィルターを呼び出しますが、$ optionsは定義されていません

分類Dev

Vue.jsアプリはhttp:// localhost:8080で実行され、バックエンドAPIに対してaxiosを使用してGETリクエストを行うと、ローカルホストがURLの先頭に追加されます

分類Dev

作成/マウントされたメソッドがまだ完了していないときにvue.jsウォッチャーを無効にするにはどうすればよいですか?

分類Dev

作成/マウントされたメソッドがまだ完了していないときにvue.jsウォッチャーを無効にするにはどうすればよいですか?

分類Dev

Jestでテストを実行すると、TrixエディターがVueコンポーネントにマウントされないのはなぜですか?

分類Dev

main.js内で必要な.jsファイル内にグローバルソートメソッドを作成します。Component.vue内:計算されたプロパティの[呼び出しの並べ替え]をクリックします。これは可能ですか?

分類Dev

Vue.js-アプリがnpmrunserveで実行されているときにターミナルを使用する

分類Dev

Vue.jsの異なるルータービュー間でアニメーションを実行することはできません

分類Dev

コンポーネントはVueインスタンスからメソッドを呼び出すことができませんv-on:click

分類Dev

Vue.jsで、カスタムフィルターを個別のファイルに記述し、main.jsで宣言することにより、さまざまなコンポーネントでそれらを使用するにはどうすればよいですか?

分類Dev

Vue.jsのモデルからメソッドにデータを渡すことができません

分類Dev

ブラウザにVue.jsの予期しないトークンがありますが、npmはエラーなしでビルドを実行します

分類Dev

ExpressサーバーをVueアプリにバンドルするVueSSR。これにより、ホストサーバーにコピーされたbuilddistフォルダーからアプリを実行できます。

分類Dev

Vue.jsミックスインはオーバーライドされた実装で親メソッドを呼び出します

分類Dev

予期しない不可解なdotnetが、Vue.jsサイトのHardSourceを使用したWebpackで「失敗」メッセージを実行します

分類Dev

ロードvue.jsでコンポーネントメソッドを実行する

分類Dev

子のメソッドで渡された小道具を使用することはできません:{} vue.js

分類Dev

VueフロントエンドとRailsバックエンドでenvvairablesを実装するにはどうすればよいですか?このタスクを完了するには、dotenvパッケージを使用する必要がありますか?

分類Dev

vue-selectを使用して複数のフィールドで検索を実行できますか?

分類Dev

Vue.js-メソッドから計算された値がループリストに表示されない

分類Dev

Vue.js-v-modelでパラメーターを渡すことにより、ネストされたプロパティを変更します

分類Dev

vueでステートメントを実行する前に、非同期が完了するのをどのように待つことができますか?

分類Dev

Vue-メソッドでデータを更新するときにコンポーネントが再レンダリングされない

分類Dev

vue jsのコンポーネントからjsファイル(他のコンポーネントではない)にデータを渡したい。コンポーネントではアクセスできますが、jsファイルではアクセスできません

分類Dev

vueコンポーネントでループが完了した後、ステートメントまたはメソッドを呼び出すにはどうすればよいですか?

Related 関連記事

  1. 1

    vue.jsコンポーネントが最初の試行でフェッチされたデータを表示しないのはなぜですか?

  2. 2

    vue.jsコンポーネント内からメソッドを実行するにはどうすればよいですか

  3. 3

    Vue.jsドロップダウンネストメニュー(子がアクティブなときは親を開いたままにします)

  4. 4

    axiosインターセプターハンドラーは、作成されたメソッドがaxios.getを呼び出しているvueコンポーネントインスタンス(このポインター)にどのようにアクセスできますか?

  5. 5

    Vue JSで、vueインスタンス内のメソッドからフィルターを呼び出しますが、$ optionsは定義されていません

  6. 6

    Vue.jsアプリはhttp:// localhost:8080で実行され、バックエンドAPIに対してaxiosを使用してGETリクエストを行うと、ローカルホストがURLの先頭に追加されます

  7. 7

    作成/マウントされたメソッドがまだ完了していないときにvue.jsウォッチャーを無効にするにはどうすればよいですか?

  8. 8

    作成/マウントされたメソッドがまだ完了していないときにvue.jsウォッチャーを無効にするにはどうすればよいですか?

  9. 9

    Jestでテストを実行すると、TrixエディターがVueコンポーネントにマウントされないのはなぜですか?

  10. 10

    main.js内で必要な.jsファイル内にグローバルソートメソッドを作成します。Component.vue内:計算されたプロパティの[呼び出しの並べ替え]をクリックします。これは可能ですか?

  11. 11

    Vue.js-アプリがnpmrunserveで実行されているときにターミナルを使用する

  12. 12

    Vue.jsの異なるルータービュー間でアニメーションを実行することはできません

  13. 13

    コンポーネントはVueインスタンスからメソッドを呼び出すことができませんv-on:click

  14. 14

    Vue.jsで、カスタムフィルターを個別のファイルに記述し、main.jsで宣言することにより、さまざまなコンポーネントでそれらを使用するにはどうすればよいですか?

  15. 15

    Vue.jsのモデルからメソッドにデータを渡すことができません

  16. 16

    ブラウザにVue.jsの予期しないトークンがありますが、npmはエラーなしでビルドを実行します

  17. 17

    ExpressサーバーをVueアプリにバンドルするVueSSR。これにより、ホストサーバーにコピーされたbuilddistフォルダーからアプリを実行できます。

  18. 18

    Vue.jsミックスインはオーバーライドされた実装で親メソッドを呼び出します

  19. 19

    予期しない不可解なdotnetが、Vue.jsサイトのHardSourceを使用したWebpackで「失敗」メッセージを実行します

  20. 20

    ロードvue.jsでコンポーネントメソッドを実行する

  21. 21

    子のメソッドで渡された小道具を使用することはできません:{} vue.js

  22. 22

    VueフロントエンドとRailsバックエンドでenvvairablesを実装するにはどうすればよいですか?このタスクを完了するには、dotenvパッケージを使用する必要がありますか?

  23. 23

    vue-selectを使用して複数のフィールドで検索を実行できますか?

  24. 24

    Vue.js-メソッドから計算された値がループリストに表示されない

  25. 25

    Vue.js-v-modelでパラメーターを渡すことにより、ネストされたプロパティを変更します

  26. 26

    vueでステートメントを実行する前に、非同期が完了するのをどのように待つことができますか?

  27. 27

    Vue-メソッドでデータを更新するときにコンポーネントが再レンダリングされない

  28. 28

    vue jsのコンポーネントからjsファイル(他のコンポーネントではない)にデータを渡したい。コンポーネントではアクセスできますが、jsファイルではアクセスできません

  29. 29

    vueコンポーネントでループが完了した後、ステートメントまたはメソッドを呼び出すにはどうすればよいですか?

ホットタグ

アーカイブ