Answers for "vuepress Duplicate keys detected"

vue duplicate keys detected

<!-- Vue Duplicate Keys Detected :
When using multiple components in 1 vue page. 
You may run into a duplicate key error. The solution I used 
was to append a text identifier to the the key to remove the duplicates. 
-->
<!---- this is where the dupe error comes from -->
<!--------- ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ -->
<div :key="update_key('text_identifier_1',key1)"> text </div>
<div :key="update_key('text_identifier_2',key2)"> text </div>

<script>
  data() {
    return {
      // this is where the dupe error comes from
      //  ↓↓↓↓ (Both keys are zero)
      key1: 0,
      key2: 0,
    };
  },
  methods: {
    // this is how we fix it (The "prefix" make it unique)
    //         ↓↓↓↓↓↓
    key_update(prefix,key){
   		return prefix+"_"+key;
    }
  }
</script>