如何呈现HTML字符串与Vue语法来自Axios GET?

Question

我有一个Symfony 5和Vue 3应用程序，Symfony控制器正在创建一个表单，并通过JSON响应提供其HTML，这是给我的表单HTML作为一个字符串，如

if ($request->isXmlHttpRequest()) {
$view = $this->renderView('vue/regForm.html.twig',[
'form' => $form->createView()
]);
return new JsonResponse([
'form' => $view,
]);
}

In my Register。vue文件，我有

<template>
<h1>Selected Plan</h1>
<div id="post-form-holder" ref="form" v-on:submit.prevent="onSubmit"></div>
</template>
<script>
export default {
async mounted() {
let { data } = await this.$http.get("/register/get/" + this.$route.params.plan);
this.$refs.form.innerHTML = data.form
},
};
</script>

这一切都在工作，表单成功输出到页面等。当我在regForm.html.twig文件中添加一些Vue语法到表单时，我的问题就来了。v-bind:class="{ 'has-error': hasError }") Vue语法显然得到渲染时，使用inderhtml。

基本上，我如何在regform.html.twig中获得Vue语法来呈现表单在Vue 3中的页面上。

Answer 1

有v-html指令。检查这个https://v2.vuejs.org/v2/guide/syntax.html#Raw-HTML