I was working on something not related to vue at all but when I refreshed this error occurred. Which is odd to me since I did not touch the code where this error occurs at all. The error says
[Vue warn]: Error in created hook: "ReferenceError: data is not defined"
found in
---> <Flash> at resources\assets\js\components\Flash.vue
And the file where it point to looks like this:
<template>
<transition name="custom-classes-transition" enter-active-class="animated bounceInRight" leave-active-class="animated bounceOutRight">
<div class="media bg-gradient depth-5 alert-position" v-show="show" role="alert">
<i class="fal fa-check-circle align-self-center m-4" style="font-size: 3rem; color: white"></i>
<div class="media-body bg-light p-4">
<div class="row">
<div class="col">
<h5 class="m-0">Succes!</h5>
</div>
</div>
<p class="m-0 text-muted"></p>
</div>
</div>
</transition>
</template>
<script>
export default {
props: ['message'],
data() {
return {
body: this.message,
show: false
}
},
created() {
if (this.message) {
this.flash();
}
window.events.$on('flash', message => this.flash(message));
},
methods: {
flash(message) {
if (data) {
this.body = message;
}
this.show = true;
this.hide();
},
hide() {
setTimeout(() => {
this.show = false;
}, 3000);
}
}
}
</script>
<style>
.media {
border-radius: 10px;
}
.media .media-body {
background-color: white !important;
border-bottom-right-radius: 10px;
border-top-right-radius: 10px;
}
.alert-position {
position: fixed;
right: 0;
bottom: 0;
margin-bottom: 50px;
margin-right: 30px;
}
</style>
I don't get this at all. It used to work perfectly and for some odd reason, it doesn't anymore. What is causing this?
via Chebli Mohamed
same problem for me . please tell me any solution if you get
RépondreSupprimer