如何將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數據設置爲表單的值？

回答

相關問題