因此，我為銷售公司的每個人提供了一個包含通知的陣列。根據通知的型別，它們具有不同的 idType。有登錄的用戶，然后是進行銷售的用戶。有些通知應該只對登錄的用戶可見，有些通知對所有人可見。
notifications: [
0: {
idType: 1
type: "delivered"
user: 12
visibility: true
seller: 15
product: "phone"
}
1: {
idType: 2
type: "meeting"
user: 12
visibility: null
seller: 12
company: "hotell"
}
2: {
idType: 1
type: "invoiced"
user: 15
visibility: null
seller: 11
value: 150000
}
]
所以如果我是 user: 12 我應該只能看到陣列中的第一個物件（用戶和賣家 ID 相同）。我不知道該怎么做。我嘗試過不同的計算和方法。
我有一個小組件用于卡片，您應該在其中看到賣家的影像（發送“注釋”作為道具）：
<div class="d-flex justify-space-between">
<div class="ml-4 d-flex justify-space-between align-center">
<seller :id="note.seller" v-slot="{ seller }">
<user-avatar :src="seller.profileImage" :size="36" class="mr-3 mr-sm-5
ml-n3 ml-sm-0"
/></seller>
<div class="d-flex flex-column">
<h6 class="font-weight-bold">{{ note.title }}</h6>
<slot name="info" />
</div>
</div>
</div>
然后我有一個看起來像這樣的組件，我在其中匯入了一個組件，因為它在每張卡中應該是不同的值：
<activity :note="note">
<template #info>
<span v-if="note.idType === 1">
{{ note.type }} {{ note.product }}
</span>
<span v-if="note.idType === 3">
{{ note.type }} for {{ note.value }} $
</span>
</template>
</activity>
然后我將它匯入另一個組件以呈現所有不同的通知，這是我訪問陣列的地方：
<div v-for="(note, idx) in notifications" :key="idx">
<activity
class="white my-3"
:note="note"
/>
</div>
所以我嘗試了不同的計算和方法，但似乎沒有任何效果。
我知道我需要做一些 if 陳述句來生成不同的陣列。但是我應該用計算方法還是方法來做呢？最好的方法是什么？我正在使用 javascript/打字稿
uj5u.com熱心網友回復：
您只需要使用computed屬性來調整您的通知。
computed() {
filteredNotifications: function(){
return this.notifications.filter(node => node.seller === this.currentUserId)
},
},
currentUserId當前用戶的id在哪里
并在模板內部使用此計算屬性來迭代組件，如下所示
<div v-for="(note, idx) in filteredNotifications" :key="idx">
<activity
class="white my-3"
:note="note"
/>
</div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/409699.html
標籤：
下一篇：使用泛型獲取嵌套型別