Flask 如何将Vue.js指令插入WTForms表单？

我正在尝试在我的网站中插入类似的内容：

在他们的示例中，html如下所示：

<div id="editor">
  <textarea :value="input" @input="update"></textarea>
  <div v-html="compiledMarkdown"></div>
</div>

<form method="POST" action="{{ url_for('edit',itemid=item.id) }}" id="text-input">
    {{ form.csrf_token }}
    <div style="margin-left:30px;margin-top:20px;">
        Title: {{ form.title }}
    </div>
    <br/>
    Content: {{ form.content(cols="80", rows="50", id='larger')|safe }}
    <br/>
    Category: {{ form.category|safe }}
    <br/>
    <input type="submit" value="Save">
</form>

我的烧瓶表单如下所示：

<div id="editor">
  <textarea :value="input" @input="update"></textarea>
  <div v-html="compiledMarkdown"></div>
</div>

<form method="POST" action="{{ url_for('edit',itemid=item.id) }}" id="text-input">
    {{ form.csrf_token }}
    <div style="margin-left:30px;margin-top:20px;">
        Title: {{ form.title }}
    </div>
    <br/>
    Content: {{ form.content(cols="80", rows="50", id='larger')|safe }}
    <br/>
    Category: {{ form.category|safe }}
    <br/>
    <input type="submit" value="Save">
</form>

{{form.csrf_token}
标题：{form.Title}


内容：{form.Content（cols=“80”，rows=“50”，id='更大'）|safe}


类别：{form.Category | safe}

---

因此，我需要以某种方式更改行

Content:{{form.Content（cols=“80”，rows=“50”，id=“更大”）|safe}

，以指示它正在使用：value=“input”和@input=“update”。我该怎么做？我是否在服务器上的表单定义中执行此操作？或者在页面加载后使用jquery

使用

kwargs

指定无效标识符的键

form.content(cols="80", rows="50", id='larger', **{':value':'input','@input': 'update'})