0

我正在使用液体和十一——我想将一个对象传递给我的简码，但我收到了一个错误。

使用 nunjunks，您可以执行类似...

// .eleventy.js

config.addPairedShortcode('alert', function(content, options = {}) {
  const { variant = 'primary' } = options;
  return `<div class="alert alert-${variant}" role="alert">${content}</div>
});

然后我可以在我的模板中传递警报

{# index.njk #}

{% alert { variant: 'danger' } %}
  A danger alert
{% endalert %}

使用此简码适用于我的液体模板，我只是无法像使用njk模板一样将对象传递给简码。

我不确定我是否只需要这样：

function(content, variant)

然后在我的液体模板通道中{% alert "danger" %}——我希望有一个对象，因为我计划有很多选项，这会让我很难看到我的模板中设置了哪些选项。

这是我在液体模板中使用简码时遇到的错误：

[dev:11ty  ] `TemplateContentRenderError` was thrown
[dev:11ty  ] > invalid syntax at line 1 col 1:
[dev:11ty  ]
[dev:11ty  ]   { variant: 'danger' }
[dev:11ty  ]   ^, file:./src/index.liquid, line:2
[dev:11ty  ]
[dev:11ty  ] `RenderError` was thrown
[dev:11ty  ] > invalid syntax at line 1 col 1:
[dev:11ty  ]
[dev:11ty  ]   { variant: 'danger' }
[dev:11ty  ]   ^
[dev:11ty  ]
[dev:11ty  ] `Error` was thrown:
[dev:11ty  ]     Error: invalid syntax at line 1 col 1:
[dev:11ty  ]
[dev:11ty  ]       { variant: 'danger' }
[dev:11ty  ]       ^
[dev:11ty  ]         at Lexer._token (/Users/Workspace/app/node_modules/moo/moo.js:533:13)
[dev:11ty  ]         at Lexer.next (/Users/Workspace/app/node_modules/moo/moo.js:480:19)
[dev:11ty  ]         at Function.parseArguments (/Users/Workspace/app/node_modules/@11ty/eleventy/src/Engines/Liquid.js:107:23)
[dev:11ty  ]         at Object.render (/Users/Workspace/app/node_modules/@11ty/eleventy/src/Engines/Liquid.js:177:33)
[dev:11ty  ]         at Object._callee$ (/Users/Workspace/app/node_modules/liquidjs/dist/liquid.common.js:1851:55)
[dev:11ty  ]         at tryCatch (/Users/Workspace/app/node_modules/liquidjs/dist/liquid.common.js:108:40)
[dev:11ty  ]         at Generator.invoke [as _invoke] (/Users/Workspace/app/node_modules/liquidjs/dist/liquid.common.js:319:22)
[dev:11ty  ]         at Generator.prototype.<computed> [as next] (/Users/Workspace/app/node_modules/liquidjs/dist/liquid.common.js:156:21)
[dev:11ty  ]         at step (/Users/Workspace/app/node_modules/liquidjs/dist/liquid.common.js:25:30)
[dev:11ty  ]         at /Users/Workspace/app/node_modules/liquidjs/dist/liquid.common.js:43:14
4

1 回答 1

0

我想到了。在我的_data文件夹中，我添加options.js了以下文件：

{
  "alert1": {
    "variant": "danger"
  }
}

然后在我的液体模板中我通过了：

{% alert options.alert1 %}
   danger alert
{% endalert %}
于 2020-11-30T16:21:31.097 回答