1、隐藏页面某个元素的方法
使用 v-if 更适合页面结构依赖条件判断，且切换不频繁的情况；使用 v-show 更适合频繁显隐的 UI 控件，比如切换 tab 页、下拉菜单等。
| 特性 | v-if | v-show |
|---|---|---|
| 渲染时机 | 条件为真时才渲染 | 无论条件真假都会渲染 |
| 控制方式 | 动态添加/删除 DOM 元素 | 通过 CSS display: none 控制 |
| 性能消耗 | 切换时性能开销大 | 初始渲染时性能开销大 |
| 适用场景 | 条件不经常变动 | 显隐状态频繁切换 |
2、计算属性（computed）与侦听器（watch）的区别
| 特性 | computed | watch |
|---|---|---|
| 用途 | 声明响应式“派生属性” | 监听某个响应式数据的变化并执行副作用 |
| 是否缓存 | 是（依赖项未变不会重新计算） | 否（每次变动都会触发） |
| 是否必须返回值 | 是（必须有返回值） | 否（可用于异步/副作用函数） |
| 是否支持异步 | 否 | 是 |
| 初始化是否执行 | 是（立即计算） | 否（默认不执行，可设 immediate: true 执行） |
| 数据变动后的影响 | 生成新的属性值 | 执行用户定义的函数（有两个参数：新值与旧值） |
| 典型使用场景 | 多个数据影响一个新属性（如总价计算） | 一个数据变化后联动多个行为（如请求数据、更新其他变量等） |
3、iframe 内外部交互方式
父页面与 iframe 子页面之间通信方式：
1）通过 window.postMessage 安全通信
父页面向 iframe 发送：
const iframe = document.getElementById('myFrame');
iframe.contentWindow.postMessage('hello from parent', '*');
子页面监听接收：
window.addEventListener('message', (event) => {
console.log('子页面收到：', event.data);
});
2）通过 window.parent / window.frames 引用父级
子页面向父页面通信：
window.parent.postMessage('hello from iframe', '*');
3）父页面直接访问 iframe 的 DOM（需同源）
const iframeDoc = document.getElementById('myFrame').contentDocument;
const input = iframeDoc.querySelector('input');
input.value = '父页面设值';