What is the best way to limit the watch function to only trigger for the selected key in the data array?
import { useSessionStorage } from "@vueuse/core";
const defaultState = {
data: [
{ key: 1, name: "A" },
{ key: 2, name: "D" },
{ key: 3, name: "C" },
]
}
const state = useSessionStorage("settings", defaultState, {
mergeDefaults: true,
});
const key0Name = toRef(
() => state.value.data[0].name
);
watch(key0Name, (newOpts) => {
console.log("key0Name", newOpts);
});
state.value.data[0].name = "Z" // Triggers watch function.
state.value.data[1].name = "Z" // Also triggers watch function.