1

アプリケーションの新しいアイデアが浮かぶたびに、私は Meteor から始めます。そして、私が何か他のものを使うことになるたびに。そして、単純なデータベースクエリの実行方法を知らないことが原因だと思います。

これは架空の例です。ユーザーがボックスに何かを入力し、ボタンを押すと、入力した内容の画像が表示されるアプリを作成したいと考えています。いくつかの画像検索 API を使用します。

<template name="image">
    <input type="text" class="description"></input>
    <button class="showImage"></button>
    <img src="{{img}}"></img>
</template>

これまでのところ、十分に単純に思えます。私の理解では、最初にデータベースに情報を入れずにクライアントに情報を送信する方法はありません。クエリを受け取り、画像情報をデータベースに入力する関数 addToDB があるとします。

Template.image.events({
    'click .showImage': function() {
        addToDB($('.description').val());
    }
});

すごい!それはまだそれほど悪くはありません。しかし、データをクライアントに送り返すには...

//server.js
Meteor.publish("image", function(query) {
    Images.find({q: query});
}

ちょっと待って。クエリがまだわからないため、クライアントがロードされたときにサブスクライブすることはできません。したがって、おそらくイベントハンドラーは

Template.image.events({
    'click .showImage': function() {
        addToDB($('.description').val());
        Deps.autorun(function() {
        Meteor.subscribe("images", $('.description').val());
    });
    }
});

よし、それをテンプレートに入れよう...

Template.image.img = function() {
    return Images.findOne().imgsrc;
}

いいえ、テンプレートが最初に読み込まれたとき、まだ Images を購読していないため、エラーが発生します。したがって、次のようにテンプレートを更新できます。

<template name="image">
    <input type="text" class="description"></input>
    <button class="showImage"></button>
    {{#each info}}
    <img src="{{info.img}}"></img>
    {{/each}}
</template>

次に、テンプレートの入力関数を次のように変更します。

Template.image.info = function() {
    return Images.find({}, {limit: 1});
}

そして出来上がり!

私は今晩、そのすべてにつまずいたことを認めようと思っているよりも長く過ごしました。それが単純な古いノードである場合、単純な jQuery を使用できたはずです。

しかし、Meteor には、私が本当に活用したい驚くべき機能が 100 万もあります。だから私が望んでいるのは、誰かが私に道を示すことができるということです. このプロセスと最終結果で、どのような間違いを犯しましたか? meteor アプリ内でこれを行うための最も素晴らしく、最もクリーンで、最も簡単な方法は何ですか。

これは非常に複雑で、他の多くのことを非常にシンプルにするフレームワーク内にあります。では、単純なデータベース クエリを作成するにはどうすればよいでしょうか。

4

1 に答える 1

2

彼らが提供する流星の例を見ることを検討してください。すべての例には、ユーザー入力の取得、コレクションの管理、テンプレートへのコレクション クエリの表示の機能があります。

ほとんどのコードは問題ないように見えますが、一度に複数の質問をしており、答えにくい視点から始めています。一般的な注意事項:

  • Session を使用して、ユーザーがイベントで設定した変数を保持することを検討してください。
  • セッション変数を Deps.autorun 関数に渡して、必要なデータをサブスクライブします
  • セッション変数をテンプレートに渡して、必要なデータを表示します。
  • 基本的な JavaScript ルールは引き続き適用されます -null.someThingIWantこれはエラーです。便利なパターンはreturn something && something.someThingIWant;

上記のコードの問題の 1 つは、パブリッシュがクエリ結果を返さないことです。タイプミスだと思います。

于 2013-11-11T06:20:53.087 に答える