diff --git a/pages/role/read.page.vue b/pages/role/read.page.vue
index 6cb9a7d20..6c83a4a9f 100644
--- a/pages/role/read.page.vue
+++ b/pages/role/read.page.vue
@@ -108,11 +108,16 @@ const receivedErrors = ref<string[]>([])
 const successMessages = ref<string[]>([])
 
 const roleData = computed<RoleAttributes<"deserialized">>({
-	get(): RoleAttributes<"deserialized"> { return role.value.data },
+	get(): RoleAttributes<"deserialized"> {
+		return role.value.data
+	},
 	set(newResource: RoleAttributes<"deserialized">): void {
-		role.value.data = {
-			...role.value.data,
-			...newResource
+		role.value = {
+			...role.value,
+			"data": {
+				...role.value.data,
+				...newResource
+			}
 		}
 	}
 })