<template> <ToggleSwitch class="right " @onChange.preventDefault="onChange" ></ToggleSwitch> <div v-show="!hidden"> <CheckBox v-if="typeof cellProps.rowData.BrandTypeId === 'boolean'" class="right space" /> <Input v-if="typeof cellProps.rowData.BrandTypeId != 'boolean'" class="right space" label="Change Colors" /> </div> </template> <script lang="ts" setup> let hidden = true const onChange = () => { console.log("toggle successful", hidden) hidden = !hidden; } </script>

El valor oculto funciona en el procesamiento y no muestra la casilla de verificación ni la entrada en el div. Al hacer clic en el valor "oculto" cambia, pero el v-show no cambia. ¿Cómo se configura esto incorrectamente?