1

こんにちは、カルーセル プラグインを使用して、トピック ビューの水平スクロールを実装しています。

ここに画像の説明を入力

そして、ページで何が起こるかは次のとおりです。

1) ユーザーはトピックを検索するために右側の数ページにスクロールできます

2) ユーザーが好きなトピックをクリックする

3) ページ全体が再レンダリングされます。つまり、トピック セクションとその下のセクションがすべて再レンダリングされます。

4) トピックセクションがリセットされ、トピックスクロールの最初のページが再び表示されます

ページが再レンダリングされたときに表示できるように、カルーセル リスト内のどの項目が選択されていたかを追跡するにはどうすればよいですか? また、スクロールを正しいページに移動して、選択したトピックを表示するにはどうすればよいですか?

私の現在の実装のスニペットは次のとおりです。

//Appending topics in carousel plugin (question page view)
addAllTopics: ->
  @options.topics.each(@addOneTopic)
  Onethingaday.Public.checkActive(Backbone.history.fragment)

  @$('li.all_topics').show()

  $('#my-carousel').carousel({
    itemsPerPage: 4,
    itemsPerTransition: 4,
    speed: 500,
    noOfRows: 1,
    nextPrevLinks: true,
    pagination: true,
    easing: 'swing'
  })

addOneTopic: (topic) ->
  if topic.get('question_count') > 0
    $(@el).find('ul.topics').append @topic_template(topic.toJSON())

//individual @topic_template - on click on topic, the route of '/topics/topic_slug' will be triggered which rerenders the whole questions page
%li
  %a{href: "/topics/<%= topic.slug %>", :'data-active' => "/topics/<%= topic.slug %>", slug: "<%= topic.slug %>", text: "<%= topic.text %>" } #<%= topic.slug %>
4

0 に答える 0