<template id="task-template">
<h1>My Tasks</h1>
<tasks-app></tasks-app>
<ul class="list-group">
<li class="list-group-item" v-for="task in list">
{{task.body|e}}
</li>
</ul>
</template>
以上是我的html。我想改为通过Vue呈现代码。
<script>
Vue.component('tasks-app', {
template: '#tasks-template',
data: function() {
return {
list: []
}
}
created: function() {
$.getJson('/api/tasks', function(data) {
this.list = data;
})
}
})
new Vue({
el: 'body',
});
</script>
上面是我的Vue代码，Jinja提出了一个例外，即“任务”未定义，我希望的是Vue而不是Jinja呈现的html代码，我知道可以在Laravel中使用以下代码来完成：
"@{{task.body}}"
由于我是Jinja的新手，所以有人可以帮助我吗？
您需要将模板的某些部分定义为原始，以便Jinja可以转义该部分，而不是尝试使用其自身的上下文来填充它。
这是您需要执行的操作：
参考：http : //jinja.pocoo.org/docs/dev/templates/#escaping