v-if 및 v-properties inside(다른 텍스트 렌더링용)

v-if 및 v-properties inside(다른 텍스트 렌더링용)

v-for 내부에서 텍스트를 렌더링하기 위한 다른 옵션을 선택할 수 있는 방법을 찾을 수 없어.아래 코드 같은 걸 하려면 논리를 다르게 구성해야 하나?

<template>
    <ul v-show="showNotifications">
        <li v-for="notification in notifications">
            // if notification.type = 'friend request'
            New friend request from {{ notification.name }}
            // else 
            New notification from {{ notification.name }}
        </li>
    </ul>
</template>

알림은 이름 및 알림 유형과 같은 데이터를 가진 개체의 배열입니다.

다른 항목 사용template다음과 같은 요소(테스트되지 않음)

<template>
    <ul v-show="showNotifications">
        <li v-for="notification in notifications">
            <template v-if="notification.type == 'friend request'">
            New friend request from {{ notification.name }}
            </template>
            <template v-else>
            New notification from {{ notification.name }}
            </template>
       </li>
   </ul>

나는 Xymanek이 말한 것을 했고 그것은 나에게 완전히 효과가 있는 것은 아니다. 나는 구성 요소가 "v-for"의 변수에 반응한다는 것을 깨달았기 때문에 이 같은 방법을 추가했다. 이 경우 "알림"은 "알림"

forceReload(){
      this.files.push(fakeNotification);
      this.files.pop();
    }

이를 알 수 있듯이 v-for가 가짜 객체를 어레이에 밀어넣음으로써 "재조정"하도록 강제한다.당신은 이 방법을 "type.type"의 값이 변경된 직후에 부를 수 있다.

참조URL: https://stackoverflow.com/questions/42634908/v-if-and-v-else-inside-of-v-for-for-different-text-rendering