0

MeteorのBootstrapリスト項目でスワイプル・左の&スワイプ・ライト・イベントを実装したいとします。 MeteorはCordovaを使用してモバイルアプリ開発用のWebViewを提供しています。メテオのフロントエンドライブラリであるBlazeでスワイプ、タッチホールドなどのjQuery Mobileイベントを処理することが可能かどうか疑問です。 以下は、Meteor official TO-DO tutorial sampleの基本例です。MeteorでjQuery Mobileのイベントを処理することは可能ですか?

tasks.htmlファイルは次のとおりです。

<template name="task"> 
    <li class="{{#if checked}} checked {{/if}}"> <!-- set the CSS for a checked task --> 
     <input type="checkbox" checked="{{checked}}"> 
     {{#if isOwner}} 
      <button class="toggle-private"> 
       {{#if private}} 
        Private 
       {{else}} 
        Public 
       {{/if}} 
      </button> 
     {{/if}} 

     <span class="text">{{text}}</span> 
     <span class="createdBy"> 
      {{#if createdBy}} 
       by {{createdBy}} 
      {{else}} 
       by anonymous user 
      {{/if}} 
     </span> 
     <a class="js-delete-task" id="deletetask" href="#" > 
      <i class="fa fa-trash-o pull-right" aria-hidden="true"></i> 
     </a> 
    </li> 
</template> 

そして、これはそのブレイズ/ JavaScriptの対応、tasks.jsです。

Template.task.helpers({ 
    isOwner: function() { 
     console.log(`this.createdBy is ${this.createdBy}`); 
     return (this.createdBy === Meteor.user().username); 
    }, 
    private: function() { 
     return this.private; 
    } 
}); 

Template.task.events({ 
    'click .js-check-task': function(event, template){ 
     if(this._id) { 
      console.log("Check the task, converting to: ", !this.checked); 
      Meteor.call('tasks.check', this._id, this.checked); 
     } 
    }, 
    'click .js-delete-task': function(event, template){ 
     console.log("Deleting the task: ", this._id); 
     if(this._id) { 
      console.log(`Calling deleteTask()`); 
      Meteor.call('tasks.delete', this._id); 
     } 
    }, 

    'click .toggle-private': function(event, template) { 
     console.log(`Toggling private`); 
     if(this._id) { 
      console.log(`Calling task.togglePrivate`); 
      if (this.private === null || this.private === undefined) 
       Meteor.call('tasks.setPrivate', this._id, false); 
      else 
       Meteor.call('tasks.setPrivate', this._id, this.private); 
     } 
    } 
}); 

モバイルスワイプの左/右イベントをリストアイテムに実装する方法を模索しています。ユーザーがリストアイテム(タスク)をスワイプすると、前方または削除アイコンなどを表示したい。

+0

私はスワイプを使用しました。良い仕事。しかし、より具体的であり、コードを共有することができれば(それがうまくいかない場合)、うまくいくでしょう。 – Ankit

+0

@Ankit、私は上記のコードを提供しました。これは実際には基本的なMeteorチュートリアルのものです。 –

+0

最近、このパッケージを使用してスワイプイベントを実装しています:https://github.com/gwendall/meteor-swing – Ankit

答えて

関連する問題