车把类型错误：无法读取未定义的属性“fn”答案

【问题标题】：Handlebars TypeError: Cannot read property 'fn' of undefined车把类型错误：无法读取未定义的属性“fn”
【发布时间】：2017-02-18 09:30:35
【问题描述】：

我创建了一个自定义车把助手，当我没有为参数定义值时出现以下错误。

module.exports = function(src, color, classatr, options) {

    if (typeof src === 'undefined') src = '';
    if (typeof color === 'undefined') color = '';
    if (typeof classatr === 'undefined') classatr = '';

    var bg = '<table class="'+ classatr +'" cellpadding="0" cellspacing="0" border="0" width="100%">\
      <tr>\
        <td background="'+ src +'" bgcolor="'+ color +'" valign="top">\
          <!--[if gte mso 9]>\
          <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="mso-width-percent:1000;">\
            <v:fill type="tile" src="'+ src +'" color="#'+ color +'" />\
            <v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">\
          <![endif]-->\
          <div>'
          + options.fn(this) +
          '</div>\
          <!--[if gte mso 9]>\
            </v:textbox>\
          </v:rect>\
          <![endif]-->\
        </td>\
      </tr>\
    </table>';

    return bg;
}

如果我这样定义所有三个参数，这将起作用：

{{#bg-img 'assets/img/hero-header.jpg' '000000' 'my-class'}}
    <container>
        <row>
            <columns>
            </columns>
        </row>
    </container>
{{/bg-img}}

如果我没有定义参数控制台显示“Handlebars TypeError: Cannot read property 'fn' of undefined”。

{{#bg-img }}
    <container>
        <row>
            <columns>
            </columns>
        </row>
    </container>
{{/bg-img}}

关于我在这里做错了什么有什么想法吗？

更新：还检查了“null”，如下所示，但仍然是同样的错误。

if (typeof src === 'undefined' || src === null) src = '';
if (typeof color === 'undefined' || color === null) color = '';
if (typeof classatr === 'undefined' || classatr === null) classatr = '';

【问题讨论】：

标签： javascript node.js handlebars.js handlebarshelper zurb-ink

【解决方案1】：

在您不想提供任何参数的地方使用null。所以，下面的代码应该可以工作：

{{#bg-img null null null}}
    <container>
        <row>
            <columns>
            </columns>
        </row>
    </container>
{{/bg-img}}

【讨论】：

有没有办法不用“null”
我认为没有。因为通过使用null，您告诉函数该参数存在（意味着它已定义），即使它不包含任何值。你不能用其他任何东西来做（即'未定义'）。所以null 是在不提供任何参数的情况下绕过的最佳方法。
{{#bg-img '' '' ''}} 可以解决问题。谢谢您的帮助。标记为答案。

【解决方案2】：

您不应在函数签名中声明可选参数。 Handlebars 将散列对象放入传递给您的函数的提供的选项对象中。通过散列对象，您可以访问所有提供的参数。请参阅Block Helpers Documentation 中的“哈希参数”部分。

module.exports = function(options) {

var src = options.hash.src;
var color = options.hash.color;
var classatr = options.hash.classatr;
if (typeof src === 'undefined') src = '';
if (typeof color === 'undefined') color = '';
if (typeof classatr === 'undefined') classatr = '';
...

【讨论】：

【解决方案3】：

也许尝试使用 null 而不是 undefined 来检查您的属性？

【讨论】：

检查了 null 和 undefined 仍然相同的错误。仍然吐出相同的类型错误。