vue component not displaying computed properties - vue.js

Question

This is a Vue3 project. When Domains.vue is mounted, getDomains is dispatched to vuex, and the data is properly set as indicated by vue dev tools.
For some reason, the data is not displayed in the template for loop. Perhaps one of you wonderful people can help me figure out why not?
Domains.vue
<template>
<div class="domains">
<h1>This is an domains page</h1>
<ul>
<li v-for="item in domains" :key="item.post_name">
<h3>{{ item.post_title }}</h3>
<p>{{ item.post_excerpt }}</p>
</li>
</ul>
</div>
</template>
<script>
export default {
name: 'Domains',
computed: {
domains() {
return this.$store.state.domains.domains
},
},
mounted() {
this.$store.dispatch('getDomains')
}
}
</script>
vuex store
import { createStore } from 'vuex'
import axios from 'axios'
export default createStore({
state: {
user: {
'id': localStorage.getItem('id'),
'token': localStorage.getItem('token'),
},
domains: {
domains: [],
totalDomains: '',
totalPages: ''
},
},
mutations: {
SET_USER(state, user) {
state.user = user
localStorage.setItem('id', user.id)
localStorage.setItem('token', user.token)
},
DELETE_USER(state) {
state.user = { token: '' }
localStorage.setItem('id', '')
localStorage.setItem('token', '')
},
SET_DOMAINS(state, data, headers) {
state.domains.domains = data
state.domains.totalDomains = headers['X-WP-Total']
state.domains.totalDomains = headers['X-WP-TotalPages']
},
SET_ME(state, data) {
state.user.me = data
},
},
actions: {
login({ commit }, payload) {
return new Promise(async (resolve, reject) => {
try {
const { data } = await axios.post(`http://sslchkr.com/wp-json/jwt-auth/v1/token`, payload)
commit('SET_USER', data)
resolve(data)
} catch(e) {
reject(e)
}
})
},
logout({ commit }) {
commit('DELETE_USER')
},
validate({ state }) {
return new Promise(async (resolve, reject) => {
try {
const { data } = await axios({
url: `http://sslchkr.com/wp-json/jwt-auth/v1/token/validate`,
method: 'post',
headers: {
'Authorization': `Bearer ${state.user.token}`
}
})
//commit('SET_USER', data)
resolve(data)
} catch(e) {
reject(e)
}
})
},
getDomains({ commit, state }) {
return new Promise(async (resolve, reject) => {
try {
const { data, headers } = await axios.get(`http://sslchkr.com/wp-json/sslchkr/v1/author/${state.user.id}/domain`, {
headers: {
Authorization: `Bearer ${state.user.token}`
}
})
commit('SET_DOMAINS', data, headers)
resolve(data)
} catch(e) {
reject(e)
}
})
},
getMe({ commit, state }) {
return new Promise(async (resolve, reject) => {
try {
const { data } = await axios.get(`http://sslchkr.com/wp-json/wp/v2/users/me`, {
headers: {
Authorization: `Bearer ${state.user.token}`
}
})
commit('SET_ME', data)
resolve(data)
} catch(e) {
reject(e)
}
})
},
},
modules: {
}
})

Answer 1

convert this
<li v-for="item in domains" :key="item.post_name">
to
<li v-for="item in domains" :key="item">
and if this doesn't work, add index as key
<li v-for="(item,idx) in domains" :key="idx">

Answer 2

Please disregard this. I jumped the gun and posted the question before I knew what was wrong.