Vue.js how to for-loop and style an objects properties within an array?

I'm currently working with Vue.JS and I've been having some trouble outputting some data with the v-for loop.

My goal is to have a 'base' item repeat itself but contain unique information, please see the image below for reference.

So far, I've somewhat go this working. I'm unsure if this is the "best" or most efficient/optimal way to do it, so I was hoping someone could give me some advice on it.

<template>
<div>
  <ul>
    <li v-for="value in items">
        
        
        
    </li>
  </ul>
</div>
</template>

<script>
export default {
  data: function () {
    return {
        items: [
          {
            itemquality: "Brand new",
            itemname: "Test Item Name",
            itemprice: "$426.32",
            bInStock: false
          },
          {
            itemquality: "Used",
            itemname: "Test Item Name 2",
            itemprice: "$126.32",
            bInStock: true
          }
        ]
    }
  }
}
</script>

The next issue I ran into is binding a class to a value based on the data in the 'items' array. If I wasn't to use an array, and instead just have a single object, I could do;

  <li v-for="(value, key) in myArrayOfObjects">
     <div :class="{'my-price-class': key === 'price'}"> </div>
  </li>

However, because I have an array, the 'key' that gets returned is just the array index. Is there any way I can use the object properties like; 'itemname' as the key while it's inside an array?

Any help is appreciated. :)