vuejs2 - Tornado 和 Vue 的模板冲突

Question

我是这两个框架的新手，我发现的第一件事就是冲突。所以因为双花括号是Tornado保留的，所以我把Vue默认的改成了单花括号:

      new Vue({
  el: '#app',
  delimiters: ['${', '}'],
  data: {
    message: 'Hello Vue.js!'
  }

模板:

<td>${ message }</td>

但现在只是没有渲染，我在浏览器中看到的是:

${ message }

如何解决这个冲突？难道我做错了什么？谢谢!

UPD 我想通了。我做错了几件事:1)我把脚本放在“头”部分而不是最后。2) 我没有将 id="app"属性添加到某些父元素来指定 app 对象。在我更改代码后，一切都开始工作了。

Answer 1

将 Tornado 与另一个使用双大括号的模板系统相结合的另一种方法是使用 {{! 转义由 javascript 处理的模板系统:

<h1>This variable comes from Tornado: {{ x }}</h1>
<p>This one comes from Vue: {{! y }}</p>

Tornado 的渲染会把感叹号去掉，把双括号留给Vue 使用。