我正在研究Laravel + spark + vue js。以下是我的代码
app js
Vue.component('spark-emergency', {
data() {
return {
emergencies:[],
deleteEmergency:[],
editEmergency:[],
editEmergencyForm: new SparkForm({}),
deleteEmergencyForm: new SparkForm({}),
newEmergency: new SparkForm({
name: '',
type: '',
description:''
})
};
},
created() {
this.getEmergencies();
},
methods: {
getEmergencies() {
this.$http.get('/get-emergencies-plan-template')
.then(response => {
this.emergencies = response.data;
});
},
deleteEmergencyPlanTemplateConfirmation(emergency){
this.deleteEmergency = emergency
$('#modal-delete-emergency').modal('show');
},
deleteEmergencyPlanTemplate(){
Spark.delete(`/delete-emergencies-plan-template/${this.deleteEmergency.slug}`, this.deleteEmergencyForm)
.then(() => {
Bus.$emit('updateEmergencies');
$('#modal-delete-emergency').modal('hide');
});
},
createEmergencyPlanTemplate(){
Spark.post('/save-emergency-plan-template', this.newEmergency)
.then(() => {
this.newEmergency.name = '';
this.newEmergency.type = '';
this.newEmergency.description = '';
Bus.$emit('updateEmergencies');
});
},
editEmergencyPlanTemplate(emergency){
this.editEmergency = emergency
$('#modal-edit-emergency').modal('show');
},
updateEmergencyPlanTemplate(){
}
}
});
刀片文件
<spark-emergency inline-template>
<div class="spark-screen container">
<div class="row">
<div class="col-md-12">
<!-- create new emergency -->
<div class="panel panel-default">
<div class="panel-heading">Create emergency</div>
<div class="panel-body">
<form class="form-horizontal" role="form"></form>
</div>
</div>
<!-- listing of emergencies -->
<div class="panel panel-default">
<div class="panel-heading">Emergencies Plan Template</div>
<div class="panel-body">
<table class="table table-borderless m-b-none">
<thead>
<th>Name</th>
<th></th>
</thead>
<tbody>
<tr v-for="emergency in emergencies">
<td>
<div class="btn-table-align">
@{{ emergency.name }}
</div>
</td>
<!-- Delete Button -->
<td>
<button class="btn btn-danger-outline" @click="deleteEmergencyPlanTemplateConfirmation(emergency)">
<i class="fa fa-times"></i>
</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- Edit Emergency Modal -->
<div class="modal fade" id="modal-edit-emergency" tabindex="-1" role="dialog"></div>
<!-- Delete Emergency Modal -->
<div class="modal fade" id="modal-delete-emergency" tabindex="-1" role="dialog"></div>
</div>
</div>
</div>
</spark-emergency>
在添加新的和编辑逻辑之前,它工作得很好但是在那之后总线。$ emit(&#39; updateEmergencies&#39;);停止工作,现在它无法正常工作。
任何建议可能是什么原因?