取消Typography勾选后文字仍残留于结果页，需修改哪部分代码？

问题根源：当前代码在取消勾选时仅将payload.typography设为undefined，但用户之前输入的文本内容可能仍残留在状态中，导致结果页依然读取并显示该内容。

需要修改的部分：

• 调整复选框的on:change回调逻辑，在取消勾选时先清空文本内容，再将payload.typography设为undefined，确保数据彻底清除：

修改后的代码片段：

<div>
    <input
        id="typography-enable"
        type="checkbox"
        bind:checked={enableTypography}
        on:change={() => {
            if (enableTypography) {
                // 勾选时初始化空对象（若未存在）
                if (typeof payload.typography === "undefined") {
                    payload.typography = { content: "" };
                }
            } else {
                // 取消勾选时先清空内容，再置为undefined
                if (payload.typography) {
                    payload.typography.content = "";
                }
                payload.typography = undefined;
            }
        }}
    />
    <label for="typography-enable">메인 사진에 문구를 추가합니다.</label>
</div>
{#if enableTypography && typeof payload.typography !== "undefined"}
    <FlexTableLayout class="my-3" name="문구">
        <div>
            <div class="mb-1">
                <input
                    id="typography-content"
                    type="text"
                    maxlength={30}
                    bind:value={payload.typography.content}
                />
            </div>

额外建议：检查结果页的渲染逻辑，确保仅当enableTypography为true且payload.typography?.content不为空时，才显示该文本内容，避免因状态判断不全导致的残留问题。

内容的提问来源于stack exchange，提问作者Kiju Shin