<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>
Run Code Online (Sandbox Code Playgroud)
以上是我的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>
Run Code Online (Sandbox Code Playgroud)
上面是我的Vue代码,Jinja引发了一个异常,即'task'未定义,我希望是由Vue而不是Jinja呈现的html代码,我知道它可以在Laravel中完成:
"@{{task.body}}"
Run Code Online (Sandbox Code Playgroud)
由于我是Jinja的新手,任何人都可以帮助我吗?
我们公司生产了一个用 svelte/sapper 编写的自动化框架。一项功能是开发人员可以创建自定义 ui 小部件,目前使用纯 js/html/css 和我们的客户端 api。这些小部件存储在数据库中而不是文件系统中。
我认为允许他们将小部件创建为 svelte 组件将是一个很大的优势,因为它在一个位置包含所有标记、js 和 css,并将为他们提供 svelte 反应性的所有好处。
我已经创建了一个使用 svelte 的服务器 API 编译组件的端点,但这似乎只是生成了一个准备好 rollup-plugin-svelte/sapper/babel 来完成生成浏览器可以使用的东西的工作的模块。
如何手动将 svelte 组件编译为 sapper/svelte 生成的最终 javascript 和 css。