如何扩展html Twig逃逸者？

Question

我正在将现有的Symfony应用程序逐步迁移到VueJS。

我最近发现的问题是{{ stuff }}标记始终由VueJS解释，即使内容来自渲染的树枝变量。

为避免这种情况，我想扩展html转义符，以分别用{和} html代码替换{和}。 / p>

我该怎么做呢？转义位于twig_escape_filter内部，没有我可以覆盖的服务。

我还尝试制作一个自定义转义策略猜测器，返回我的vue转义符，在替换所需的字符之前，它本身以twig_escape_filter转义了html。我所有的源代码都被转义了。 :-D

感谢您的帮助。

Answer 1

实际上，您可以像这样简单地在JavaScript中解决此问题：

import Vue from 'vue';

Vue.options.delimiters = ['${', '}'];

现在，您可以像以前一样在树枝上使用双括号（{{ }}），在VueJ上使用${ }。

编辑：您无法做的事情。您确实可以使用像这样的简单过滤器将{{ }}转换为其相应的html实体：

new \Twig_Filter('yourFilter', function ($string) {
    return htmlentities($string, ENT_HTML5);
}, ['is_safe' => ['html']])

但是由于Vue在渲染的html之上运行，所以仍然会出现您出现的冲突（因为html会将这些html实体渲染为方括号）。

您唯一的解决方案是像这样为Vue使用更具体的距离，以避免这种冲突：

Vue.options.delimiters = ['$vue{', '}'];