Revadike
Revadike
NNuxt
Created by Revadike on 1/3/2025 in #❓・help
Responsive component property racing pinia store
I'm absolutely banging my head on this. I have the following.
const { inLibrary, inWishlist, inBlacklist, inTradelist } = useCollectionsStore(); // pinia store actions
const getRowClass = item => {
return {
'app-row': true,
'in-library': inLibrary(item.appid),
'in-wishlist': inWishlist(item.appid),
'in-blacklist': inBlacklist(item.appid),
'in-tradelist': inTradelist(item.appid)
};
};



/*
<v-data-table
:items="items"
:row-props="(item) => ({ class: getRowClass(item) })"
/>
*/
const { inLibrary, inWishlist, inBlacklist, inTradelist } = useCollectionsStore(); // pinia store actions
const getRowClass = item => {
return {
'app-row': true,
'in-library': inLibrary(item.appid),
'in-wishlist': inWishlist(item.appid),
'in-blacklist': inBlacklist(item.appid),
'in-tradelist': inTradelist(item.appid)
};
};



/*
<v-data-table
:items="items"
:row-props="(item) => ({ class: getRowClass(item) })"
/>
*/
I can't get row props to work properly. It adds the app-row class to each row, but nothing else. I've tested the getRowClass function separately and it works fine. I suspect a race condition: getRowClass is called before pinia is initialized. And since its not responsive, it won't be corrected later. Is there perhaps any way to make this responsive? I've tried many ways but failed... the main issue is it needs the context of item to work.
59 replies
NNuxt
Created by Revadike on 8/24/2024 in #❓・help
Reset component state after navigation
I have a page that only includes 1 component (because I reuse it across multiple pages). However, this leads to unexpected behavior: Whenever I navigate back to the page, it still has the old state. Is there a way to make sure this state is reset after navigation, without having to manually do this? ssr is off btw according to chatgpt, the state should reset between mounts and unmounts, so maybe its a bug? i currently use
41 replies