最新消息:XAMPP默认安装之后是很不安全的,我们只需要点击左方菜单的 "安全"选项,按照向导操作即可完成安全设置。

LARAVEL學習 DAY 22 VUE.JS(六)

XAMPP下载 admin 631浏览 0评论
 LARAVEL學習 DAY 22 VUE.JS(六)
前言

正文
繼續貼code…
router

{
path: ‘/:id/edit’,
component: require(‘./components/Edit’)
}
edit

<template>
<div class=”container”>
<div class=”form-group”>
<label for=”title”>標題</label>
<input type=”text” class=”form-control” v-model=”title”>
</div>
<div class=”form-group”>
<label for=”content”>內容</label>
<textarea class=”form-control” name=”content” cols=”30″ rows=”10″ v-model=”content”></textarea>
</div>
<router-link class=”btn btn-default” :to=”`/${post.id

}`”>返回</router-link>
<button type=”button” class=”btn btn-primary” @click=”send”>送出</button>
</div>
</template>

<script>
export default {
data: () => {
return {
post: null,
title: ”,
content: ”
};
},
created() {
const id = this.$route.params.id

;
axios.get(`api/crud/${id}`).then(response => {
const post = response.data.post;
this.post = post;
this.title = post.title;
this.content = post.content;
});
},
methods: {
send() {
const title = this.title.trim();
const content = this.content.trim();
axios
.put(`api/crud/${this.post.id

}`, {
title: title,
content: content
})
.then(response => {
const post = response.data.post;
this.$router.push(`/${this.post.id

}`);
});
}
}
};
</script>
這次就是之前全部的結合 然後這篇就是vue的最後一篇了

結語
還剩8篇 我再來想想要講什麼玩意

转载请注明:XAMPP中文组官网 » LARAVEL學習 DAY 22 VUE.JS(六)

您必须 登录 才能发表评论!