頁面控制 - daniel-qa/Vue GitHub Wiki
控制頁面的顯示:就是控制 v-if 的 index 標籤
<el-row style="height: 10vh; display: flex; justify-content: center; align-items: center;">
<!-- 上一步按钮,触发父组件事件,将 active 设置为 0 -->
<el-button type="primary" @click="goPreviousStep">上一步</el-button>
<el-button type="primary" @click="goNextStep">下一步</el-button>
</el-row>
// 上一步的逻辑:将 active 设置为 0
const goPreviousStep = () => {
emit('update-active', 0); // 通知父组件更新 active 的值为 0
};
<div v-if="active === 1">
<New_Msg_BatchSelect active="active" @update-active="updateActive" />
</div>
// 更新 active 的方法
const updateActive = (newActive) => {
active.value = newActive;
if (active.value === 1) {
title.value = "批量挑選";
}
if (active.value === 2) {
title.value = "個別挑選";
}
};