如何将vue数据设置为表单的值？

我有一个用于编辑博客帖子的网页。它有以下vue：如何将vue数据设置为表单的值？

<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/> 

      <div id="editor"> 
      Content: {{ form.content(**{':value':'input','@input': 'update'}) }} 
       <div v-html="compiledMarkdown"></div> 
      </div> 
      <br/> 
      Category: {{ form.category|safe }} 
      <br/> 
      <input type="submit" value="Save"> 
     </form> 
<script> 
new Vue({ 
    el: '#editor', 
    data: { 
    input: "starting data" 
    }, 
    computed: { 
    compiledMarkdown: function() { 
     return marked(this.input, { sanitize: true }) 
    } 
    }, 
    methods: { 
    update: _.debounce(function (e) { 
     this.input = e.target.value 
    }, 300) 
    } 
}); 
</script>

我想要做的是有一个基于瓶子发送的东西的输入起始值。基本上我会改变输入：“开始数据”输入：{{form.content.data}}。但是，当我这样做时，它会在更改框中的文本时停止更新输入。我认为我对数据进行了硬编码，使其成为form.content.data中的任何内容，而不是字符串。

我该如何传递它，以便它以form.content.data值开始，但仍然可以更改？

来源

2017-07-20 BigBoy1337

当'form.content'呈现时显示“开始数据”吗？ – Ikbel

是的。 form.content.data的确如此。但我只是意识到问题是我需要引用模板标签，如'{{form.content.data}}'。它试图将变量定义为文本而不是字符串，并且无法完成。现在一切正常！ – BigBoy1337

它没有工作的原因是因为{{ form.content.data }}作为原始文本出现在模板中。

因此它试图像使用的东西：棕色狐狸跳过了懒狗

，这不会编译为JavaScript对象。围绕{{ form.content.data }}添加引号，如'{{ form.content.data }}'修正了它。

来源

2017-07-20 12:53:55 BigBoy1337

如何将vue数据设置为表单的值？

回答

相关问题