-
Notifications
You must be signed in to change notification settings - Fork 1
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
watch()
function does not trigger in prod build
#42
Comments
Thats a bug in vue v3.2.31: vuejs/core#5707 |
In |
Use a workaround with a proxy handler?
The quick test above did not work. |
Test with: Reflect.set(target, propertyKey, value)
Reflect.set(target, propertyKey, value, receiver) https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/set |
this.settings = new Proxy(this.settings, {
set(target, prop, value, receiver) {
console.log("Settings proxy", prop);
let result = Reflect.set(target, prop, value, receiver);
if (!target.groupItems) {
Reflect.set(target, "groupRoomItems", false, receiver);
Reflect.set(target, "groupEndpointItems", false, receiver);
Reflect.set(target, "groupDeviceItems", false, receiver);
}
if (target.showGradientBackground) {
document.getElementById("app").classList.remove("bg-dark");
document.getElementById("app").classList.add("gardien-background");
} else {
document.getElementById("app").classList.add("bg-dark");
document.getElementById("app").classList.remove("gardien-background");
}
routes.forEach((route) => {
route.visible = target[`show${route.name}Button`];
});
return result;
},
}); Works in dev the same as |
Todo: test the setting stuff in store.jsmain.js instead of the watch callback. |
pinia.use(({ store }) => {
if (store.$id === "settings") {
// listen for changes
// `.watch()` in Settings.vue does not work.
// see #42
store.$subscribe((mutation, state) => {
if (!store.groupItems) {
store.groupRoomItems = false;
store.groupEndpointItems = false;
store.groupDeviceItems = false;
}
if (store.showGradientBackground) {
document.getElementById("app").classList.remove("bg-dark");
document.getElementById("app").classList.add("gardien-background");
} else {
document.getElementById("app").classList.add("bg-dark");
document.getElementById("app").classList.remove("gardien-background");
}
});
// initial background settings
if (store.showGradientBackground) {
document.getElementById("app").classList.remove("bg-dark");
document.getElementById("app").classList.add("gardien-background");
} else {
document.getElementById("app").classList.add("bg-dark");
document.getElementById("app").classList.remove("gardien-background");
}
}
}); Does the trick. |
Does not work after
npm run build
nor innpm run preview
E.g: "Enable background gardient" setting
The text was updated successfully, but these errors were encountered: