"Unrecognized property or method "show" is being referenced in the rendering stage. To resolve this, ensure that the property is reactive by including it in the data option for functional components or initializing it for class-based components."
This block of code belongs to me.
<script>
import { SlideYUpTransition } from 'vue2-transitions'
export default {
data: () => ({
listitems: [{
title: 'Attendance Management',
path: '/attendanceCheck'
},
{
title: 'Student Administration',
path: '/studentAdministration'
},
{
title: 'Notification Settings',
path: '/notificationSetting'
}
],
components: {
SlideYUpTransition
},
data() {
return {
show: true
}
}
})
}
</script>
<style>
/*-- Main Content --*/
/* .content {
width: 580px;
padding: 20px;
margin-bottom: 20px;
float: left;
} */
@media ( max-width: 480px) {
.container {
width: auto;
}
.content {
float: none;
width: auto;
}
}
</style>
<template>
<!-- Main Content ( Image, Notice ) -->
<div class="main-content">
<section>
<v-parallax src="/images/bg.png" height="650"></v-parallax>
</section>
<slide-y-up-transition>
<div v-show="show">Your content goes here</div>
</slide-y-up-transition>
</div>
</template>