0
我正在使用Vue.js刪除我的對象數組中的一個對象,問題是我找不到通過它的唯一ID刪除對象的方法。我正在使用vue.js版本1.我還需要一種方法來更新同一個對象(它必須是被動的,所以我的視圖會自動更新)。Vue JS通過唯一ID刪除數組中的對象?
<!DOCTYPE html>
<html lang="en">
<head>
\t <meta charset="UTF-8">
\t <title>Vue Js - components</title>
</head>
<body>
<!-- index.html -->
<div id="app">
<div class="container-fluid">
<ul class="list-group">
<post v-for="posty in posts" :posty="posty" track-by="uuid"></post>
</ul>
</div>
</div>
<template id="my-component">
\t <div v-if="posty.votes === '15'">
\t <button v-on:click="testFunc(posty.uuid)">{{posty.title}}</button>
\t </div>
\t <div v-else>
\t <button v-on:click="testFunc(posty.uuid)">No</button>
\t </div>
</template>
<script src="vue-v1.js"></script>
<script>
Vue.component('post', {
template: "#my-component",
props: ['posty'],
methods: {
\t testFunc: function(index){
\t \t this.$parent.parentMethod(index);
\t }
}
});
var vm = new Vue({
el: "#app",
data: {
posts: [{ \t uuid: '88f86fe9d',
\t \t \t \t title: "hello",
\t \t \t \t votes: '15'
\t \t \t },
\t \t \t { \t
\t \t \t \t uuid: '88f8ff69d',
\t \t \t \t title: "hello",
\t \t \t \t votes: '15'
\t \t \t },
\t \t \t { \t
\t \t \t \t uuid: '88fwf869d',
\t \t \t \t title: "hello",
\t \t \t \t votes: '10'
\t \t \t }]
},
methods: {
\t parentMethod: function(index){
\t \t Vue.delete(this.posts, index);
\t }
}
});
</script> \t
</body>
</html>
謝謝你,很棒的解決 – 75Kane