<template>
<div><textarea v-model='content'></textarea><br/><input type='button' @click='submit' value='留言' />
</div>
</template><script>
export default {data () {return {content: ''}},methods: {submit: function () {this.$http.post('/api/interface/blogs/add_comment',{content: this.content}).then((response) => {alert('提交成功!, 剛才提交的內容是: ' + response.body.content)},(response) => {alert('出錯了')})}}
}
</script>
效果如下:
說明:
(1) 下面的代碼是帶輸入的表單項
<textarea v-model='content'>
</textarea>(2) 下面的代碼則是按鈕被單擊后觸發提交表單的函數submit
<input type='button' @click='submit' value='留言' />(3) 下面的代碼定義了提交表單的函數submit
submit: function () {this.$http.post('/api/interface/blogs/add_comment',{content: this.content}).then((response) => {alert('提交成功!, 剛才提交的內容是: ' + response.body.content)},(response) => {alert('出錯了')})
}
參考 《Vue.js快速入門》 P102~P104
)
)
