Jade - 对象和混合
Jade - objects and mixins
所以我试图将一个对象传递给一个 mixin,我的 mixin 如下:
mixin summarySection(panelID, bodyID, title, options)
div(class='panel panel-default panel-summary')
div(id=panelID class='panel-heading' role='tab')
h4(class='panel-title')= title
div(class='pull-right')
if(options.dropdown)
select
option #{options.dropdown.options}
a(role='button' data-toggle='collapse' href='##{bodyID}' aria-expanded='#{options.expanded}' aria-controls=bodyID) +
div(id=bodyID class='panel-collapse collapse' role='tabpanel' aria-labelledby=panelID class= options.hasOwnProperty('expanded') ? 'in' : '')
div(class='panel-body')
if block
block
else
p Content goes here
if (options.footer)
div(class='panel-footer text-center')
a(href='#{options.footer.link}') #{options.footer.text}
我调用mixin如下:
+summarySection('panelRecentActivity', 'bodyRecentActivity', 'Recent Activity', {'expanded': 'true', 'dropdown': {'options': 'Last 30 days'}})
+summarySection('panelStatements', 'bodyStatements', 'Statements')
当我调用所有变量时,它工作正常,但如果我没有在对象中传递某个变量,那么它会抛出一个错误,指出它未定义。例如,对于上面的第二个 mixin 调用,我得到错误 Cannot read property 'dropdown' of undefined
因为它没有定义。
如何正确检查它们是否已定义并避免错误?
最好在使用它们之前检查函数或 mixin 中的值是否可用。您可以使用条件语句来避免此类问题。例如,您可以执行以下操作:
if options && options.footer
a(href='#{options.footer.link}') #{options.footer.text}
所以我试图将一个对象传递给一个 mixin,我的 mixin 如下:
mixin summarySection(panelID, bodyID, title, options)
div(class='panel panel-default panel-summary')
div(id=panelID class='panel-heading' role='tab')
h4(class='panel-title')= title
div(class='pull-right')
if(options.dropdown)
select
option #{options.dropdown.options}
a(role='button' data-toggle='collapse' href='##{bodyID}' aria-expanded='#{options.expanded}' aria-controls=bodyID) +
div(id=bodyID class='panel-collapse collapse' role='tabpanel' aria-labelledby=panelID class= options.hasOwnProperty('expanded') ? 'in' : '')
div(class='panel-body')
if block
block
else
p Content goes here
if (options.footer)
div(class='panel-footer text-center')
a(href='#{options.footer.link}') #{options.footer.text}
我调用mixin如下:
+summarySection('panelRecentActivity', 'bodyRecentActivity', 'Recent Activity', {'expanded': 'true', 'dropdown': {'options': 'Last 30 days'}})
+summarySection('panelStatements', 'bodyStatements', 'Statements')
当我调用所有变量时,它工作正常,但如果我没有在对象中传递某个变量,那么它会抛出一个错误,指出它未定义。例如,对于上面的第二个 mixin 调用,我得到错误 Cannot read property 'dropdown' of undefined
因为它没有定义。
如何正确检查它们是否已定义并避免错误?
最好在使用它们之前检查函数或 mixin 中的值是否可用。您可以使用条件语句来避免此类问题。例如,您可以执行以下操作:
if options && options.footer
a(href='#{options.footer.link}') #{options.footer.text}