Spookie/assets/js/components/pages.vue

48 lines
1.0 KiB
Vue

<template>
<div>
<h2 v-if="page" v-html="page.name"></h2>
<div v-if="page" v-html="page.content"></div>
<b-button :to="editTarget" variant="outline"><i class="fa fa-2x fa-fw fa-edit"></i></b-button>
<hr>
</div>
</template>
<script>
import axios from 'axios';
export default {
name: "Pages",
data: () => ({
page: null
}),
watch: {
$route() {
console.log("watch called")
this.getPagesDetails()
}
},
beforeMount() {
this.getPagesDetails()
},
methods: {
getPagesDetails() {
const slug = this.$route.params.slug
console.log("slug: " + slug)
axios
.get('/api/pages?slug=' + slug)
.then(response => (this.page = response.data['hydra:member'][0]))
}
},
computed: {
editTarget() {
if (this.page) {
return "/pages/edit/" + this.page.slug
}
}
}
}
</script>