Handlebars sanitize string - SyntaxError: unterminated string literal

Question

我目前正在使用 Publii CMS 开发一个使用 Handlebars 的应用程序。我正在positions.hbs 文件中创建一个 Vue 应用程序。我正在使用 Handlebars 从 CMS 检索一个长字符串以创建 JSON 对象。

{{#getPostsByTags 30 "jobs" " "}}
  jobsData.push(
      {
        "title": "{{ title }}",
        "url": "{{ url }}",
        "mainTag": "{{ mainTag.name }}",
        "description": "{{ mainTag.description }}"
      }
    )
{{/getPostsByTags}}

{{ mainTag.description }} 抓取存储在 CMS 中的文本并在控制台中引发错误。

SyntaxError: 未终止的字符串文字

我可以从第 45 行看到可能有新的行或字符会引发错误。在该行上，我可以看到字符串如下。

在将 Handlebars 中的不需要的字符传递给 description: 值时，如何清理或删除它？我尝试过的一件事是使用 JSON.stringify 没有成功。

 "description": "JSON.stringify({{ mainTag.description }})"

[了解更多]

我该如何清理该字符串？还是我必须从 CMS 解决这个问题？我只存储包含<p> 标签的文本。我该如何解决这个问题？然后我将数据传递给 Vue 应用程序，这里是完整代码。

<script>
    let jobsData = [];

    {{#getPostsByTags 30 "jobs" " "}}
      jobsData.push(
          {
            "title": "{{ title }}",
            "url": "{{ url }}",
            "mainTag": "{{ mainTag.name }}",
            "description": "{{ mainTag.description }}"
          }
        )
    {{/getPostsByTags}}

    window.onload = function () {
        var app = new Vue({
          delimiters: ['${', '}'],
          el: '#app',
          data: {
            jobs: jobsData
          },
          computed: {
            sectionTitlesWithJobs: function () {
              let tags = [];
              this.jobs.forEach(job=> {
                tags.push(job.mainTag)
              })

              tags = tags.filter((a, b) => tags.indexOf(a) === b)
              return tags.sort();
            }
          }
        });
    }
</script>

这是有问题的字符串的样子：

"<p>The Product team conducts user research, creates user experience, and works closely with the internal and vendor technology teams to prototype, develop, and maintain evolving digital tools. The team also leads outreach, training and customer service for the </a href="https://www1.nyc.gov/site/opportunity/portfolio/products.page">products in its portfolio</a>. The public-facing products include <a href="https://access.nyc.gov/">ACCESS NYC</a>,
        <a href "https://growingupnyc.cityofnewyork.us/">Growing Up NYC</a>, and <a href="https://growingupnyc.cityofnewyork.us/generationnyc/">Generation NYC</a> and their related APIs.</p><p>The Product team works closely integrated with other NYC Opportunity teams, including the development, design, and data teams. It also engages with other program and technology staff across City government. The team helps NYC Opportunity and our agency partners translate anti-poverty program and policy goals into digital strategies. The team also helps define how the City of New York uses modern, agile and user-centric approach to technology products, including offering product management best practices. Working as part of the team is an opportunity to continue to build a model for in-house product development and serve as national leader in digital government innovation.</p>"

Answer 1

这将删除换行符：

mainTag.description.split('\n').join('')