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" 属性来指定应用程序对象。在我更改代码后，一切都开始工作了。

标签： vuejs2tornado

Answer 1

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

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

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