我正在創(chuàng)建一個 Laravel SPA，我使用 Vue.js 作為前端。我遇到了這個錯誤，我不知道如何解決這個問題，因?yàn)槲艺J(rèn)為我的代碼沒有任何問題。@click除了editModal表格的編輯按鈕中的功能外，我的組件中的所有功能都可以使用。有人能幫我嗎？用戶.vue<button class="btn btn-success" @click="newModal" data-toggle="modal" data-target="#addNew"> <table class="table table-hover"> <tbody> <tr> <th>ID</th> <th>Name</th> <th>Email</th> <th>Type</th> <th>Registered</th> <th>Modify</th> </tr> <tr v-for="user in users" :key="user.id"> <td>{{user.id}}</td> <td>{{user.name}}</td> <td>{{user.email}}</td> <td>{{user.type| upText}}</td> <td>{{user.created_at| myDate}}</td> <td> <a href="#" @click="editModal(user)"> <i class="fa fa-edit"></i> </a> <a href="#" @click="deleteUser(user.id)"> <i class="fa fa-trash text-red"></i> </a> </td> </tr> </tbody> </table>//Modal<div class="modal fade" id="addNew" tabindex="-1" role="dialog" aria-labelledby="addNewLabel" aria-hidden="true">...some modal code
2 回答
GCT1015
TA貢獻(xiàn)1827條經(jīng)驗(yàn) 獲得超4個贊
我解決了。我只是玩我的代碼并更改了代碼
<a href="#" @click="editModal(user)">
到
<a href="#" data-toggle="modal" data-target="#addNew" @click="editModal(user)">
. 你認(rèn)為這是一個好的解決方案嗎？是還是不是？請讓我知道，以便我可以學(xué)習(xí)
開滿天機(jī)
TA貢獻(xiàn)1786條經(jīng)驗(yàn) 獲得超13個贊
我為你制作了工作示例
new Vue({
el: "#app",
data() {
return {
users: []
}
},
created() {
this.fetchUsers()
},
methods: {
fetchUsers() {
axios.get('https://jsonplaceholder.typicode.com/users')
.then(response => this.users = response.data)
},
newModal() {
$('#addNew').modal('show');
},
editModal(user) {
$('#addNew').modal('show');
},
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.0/axios.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<div id="app">
<button class="btn btn-success" @click="newModal" data-toggle="modal" data-target="#addNew">Add new</button>
<table class="table table-hover">
<tbody>
<tr>
<th>ID</th>
<th>Name</th>
<th>Email</th>
<th></th>
</tr>
<tr v-for="user in users" :key="user.id">
<td>{{user.id}}</td>
<td>{{user.name}}</td>
<td>{{user.email}}</td>
<td>
<a href="#" @click="editModal(user)">
Edit
</a>
</td>
</tr>
</tbody>
</table>
<div class="modal fade" id="addNew" tabindex="-1" role="dialog" aria-labelledby="addNewLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
Here I'm
</div>
</div>
</div>
</div>
- 2 回答
- 0 關(guān)注
- 177 瀏覽
添加回答
舉報(bào)
0/150
提交
取消