Backbone Marionette:集合没有渲染

时间:2017-05-23 17:30:14

标签: javascript backbone.js marionette

有人能够告诉我为什么这根本不会渲染吗?我一直在不知疲倦地试图调试这个很长一段时间没有运气。无论我做什么,它都不会渲染。在fetch函数的成功回调中,我记录了数据并将其记录在那里。但它只是没有出现在视图中。

import Bb from 'backbone';
import Mn from 'backbone.marionette';
import template from '../templates/LayoutTemplate.jst';
import ListasView from './ListasView.js';

const ListaCollection = Bb.Collection.extend({
  url: "http://localhost:3000/api/v1/lista/all",
  parse(data) {
    return data.lista;
  }
});

const listaCollection = new ListaCollection();

const LayoutView = Mn.View.extend({
  initialize() {
    listaCollection.fetch({
      reset: true,
      success(data) {
        console.log(data.toJSON());
      }
    });
  },
  collection: listaCollection,
  template: template,
  regions: {
    listasContainer: '#listas-container'
  },
  onRender() {
    this.showChildView('listasContainer', new ListasView({collection: listaCollection }));
  }
});

export default LayoutView;

这是我的模板:

<% _.each(items, function(item) { %>
  <div class="mdl-cell mdl-cell--6-col">
    <div class="demo-card-wide mdl-card mdl-shadow--2dp">
      <div class="mdl-card__title">
        <h2 class="mdl-card__title-text"><%= item.titulo %></h2>
      </div>
      <div class="mdl-card__supporting-text">
        <%= item.descricao %>
      </div>
      <div class="mdl-card__actions mdl-card--border">
        <button class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect show-modal">
          <i class="material-icons">arrow_forward</i>
        </button>
        <button class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect">
          <i class="material-icons">mode_edit</i>
        </button>
        <button class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect">
          <i class="material-icons">clear</i>
        </button>
      </div>
    </div>
  </div>
<% }) %>

0 个答案:

没有答案