我不知道发布这个问题的正确位置,但我正在阅读 Marionette 文档并在描述时看到以下代码
var MyView = Marionette.ItemView.extend({
ui: {
"destroy": ".destroy-btn"
},
events: {
"click @ui.destroy": "warnBeforeDestroy"
}
我以前从未在对象键中见过 @
符号。 @
是什么意思,还是它只是字符串的一部分,没有什么特别之处?
最佳答案
TL;DR Backbone.Marionette View 中事件对象的属性名称中以 @
符号开头的字符串由 Marionette 解析。 Marionette 将匹配 @ui.
之后的字符串,并将其替换为该 View 的 ui
散列中的相应值。在您的示例中,"click @ui.destroy"
变为 "click .destroy-btn"
。
Marionette ui
Marionette 通过一些语法糖进行了增强,以帮助您更好地组织 View 中的 DOM 依赖项。换句话说, Marionette View 可以在您的 View 中使用 ui
散列,该散列保存对该 View 的 el
内的 DOM 元素的引用。在您设置的示例中
ui: {
"destroy": ".destroy-btn"
}
这假设您的 View 模板将至少有一个具有类 .destroy-btn
的元素。呈现 View 后,Marionette 将调用 view.bindUIElements
并且 ui
散列的每个成员都将填充代表匹配元素的 jQuery 对象传递给 ui
对象的选择器。
因此,在您的 View 中,this.ui.destroy
将为选择器返回 jQuery 对象 .destroy-btn
在您的 View 中 el
.
Marionette 解析 events
哈希
Marionette 会为您做的另一件事是解析您的事件
哈希,这就是您的问题所在。如果它发现任何包含 @ui.
前缀的 events
属性,它将捕获 之后的字符串。
并返回存储在 中的选择器code>ui
散列。
所以,如果你有
events: {
"click @ui.destroy": "warnBeforeDestroy"
}
Marionette 将向 Backbone 传递一个 events
散列,如下所示:
events: {
"click .destroy-btn": "warnBeforeDestroy"
}
进一步引用
关于javascript - @ 对象键中的符号,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28420968/