在 BackboneJS 中查看部分内容

发布于 2024-11-30 21:31:13 字数 92 浏览 0 评论 0原文

有什么方法可以在 Backbone 中使用视图部分吗?我正在使用内置的下划线模板,并且没有太多关于此的文档。

如果没有,是否有任何标准/惯例或建议的方法?

Are there any ways to use view partials in Backbone? I'm using the built in Underscore templating and there isn't much documentation on this.

If not, are there any standards/conventions or suggested ways of doing this?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

汹涌人海 2024-12-07 21:31:13

是的,我最近尝试过这个。请务必阅读 Backbone 文档,特别是视图部分

例如,您有一个 _new.jst.haml:

%form#story_form.new_story{method: "post"}

然后,您可以有一个包含表单元素的 _form.jst.haml。在你的 Backbone.View 中,你可以首先在 el 中附加新模板,然后使用 Backbone 的视图范围选择器(这在他们的官方文档中,在“$(jQuery or Zepto)”部分下):

$(this.el).html(window.JST['stories/_new'](attrs));
...
this.$('#story_form').html(window.JST['stories/_form'](attrs));

我正在使用Rails,所以我最初阅读了如何在 Rails 中使用 Backbone.js 摘自本文。该文章末尾有一个指向第 2 部分的链接。我建议您跳过第一篇文章中使用字符串连接来更新视图的部分。另外,我现在的做法与他的做法有很大不同,但我认为这是一个很好的起点,而且我也没有自己的文章可以展示。

我的代码示例有点短,但我想我不想在这里写整个教程。只需让我知道什么不起作用,以及您认为缺少哪一步,我会更新答案。

Yes, I have tried this recently. Make sure to read on the Backbone documentation, particularly the View section.

For example, you have a _new.jst.haml:

%form#story_form.new_story{method: "post"}

Then, you can have a _form.jst.haml that contains the form elements. In your Backbone.View, you can first append the new template in your el, followed by using the view-scoped selectors of Backbone (this is in their official documentation, under "$(jQuery or Zepto)" section):

$(this.el).html(window.JST['stories/_new'](attrs));
...
this.$('#story_form').html(window.JST['stories/_form'](attrs));

I was using Rails and so I initially read up on using Backbone.js with Rails from this article. There's a link to a part 2 at the end of that article. I suggest you skip the part in the first article where he uses string concatenation for updating the views. Also, my approach now is quite different from how he did it, but I think it's a pretty good starting point, and I don't have my own article to show for anyway.

My code examples are somewhat short, but I guess I don't want to write an entire tutorial here. Just let me know what doesn't work, and what step you think is missing and I'll update the answer.

空袭的梦i 2024-12-07 21:31:13

是的,您可以在模板中使用部分,并且不必在 View 类中设置它们,您可以直接从模板中进行设置。这是一个简单的示例:

users.jst:

<ul>
  <% _.each(users, function(user){ %>
    <li>
      <%= JST['user']({user: user}) %>
    </li>
  <% }); %>
</ul>

user.jst:

<%= user.get('name') %>

Yes, you can use partials in your templates and you don't have to set them up in your View class, you can do it right from your templates. Here's a simple example:

users.jst:

<ul>
  <% _.each(users, function(user){ %>
    <li>
      <%= JST['user']({user: user}) %>
    </li>
  <% }); %>
</ul>

user.jst:

<%= user.get('name') %>
无远思近则忧 2024-12-07 21:31:13

有许多“普通”Backbone 方法可以做到这一点,但我强烈建议您研究 MarionetteJS、Backbone.CollectionView 或 Backbone.LayoutManager。例如,在渲染集合时需要跟踪很多内容(子项删除时的解除绑定事件、选择器范围、保持排序顺序),并且无需重新发明轮子。

There are many "vanilla" Backbone ways to do this, but I'd highly recommend looking into MarionetteJS, Backbone.CollectionView or Backbone.LayoutManager. There's alot to keep track of when rendering collections for example (unbinding events on child removal, selector scope, keeping sort order), and there's no need to reinvent the wheel.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文