Upon executing the command gulp --ship, an error message appears in the terminal:
NonErrorEmittedError: (Emitted value instead of an instance of Error) <app-Player-List v-for="player in players">: component lists rendered with v-for should have explicit keys. See https://vuejs.org/guide/list.html#key for more info.
In my TeamInfos.vue class, Visual Studio indicates a specific line as erroneous:
<app-Player-List v-for="(player, index) in players" :player="player" :index="index++"></app-Player-List>
A hover over this line shows:
[vue/valid-v-for]
Custom elements in iteration require 'v-bind:key' directives.eslint-plugin-vue
I am uncertain about how to resolve this issue. Below is the complete class:
<template>
<div>
<!-- Template content -->
</div>
</template>
<script>
import * as $ from "jquery";
import PlayerList from "./PlayerList.vue";
export default {
// Component details and methods
};
</script>
<style>
/* Styling rules */
</style>