fix: 返回首页按钮移到Vue作用域外 + 过渡动画升级
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
- back-home-link 移到 #login/#regist 的 Vue 实例外面,不受 v-cloak 影响 - 过渡动画改用捕获阶段(true),比 Vue 先拦截 click - 加 transitioning 防抖,防止重复触发 - 暴露 window.__navigateTo() 供 Vue 编程式跳转使用
This commit is contained in:
@@ -10,17 +10,34 @@
|
||||
<!-- 页面过渡动画 -->
|
||||
<script>
|
||||
(function() {
|
||||
var transitioning = false;
|
||||
|
||||
function doTransition(href) {
|
||||
if (transitioning || !href) return;
|
||||
transitioning = true;
|
||||
document.body.classList.add('page-leaving');
|
||||
setTimeout(function() {
|
||||
// 直接用原始赋值跳转
|
||||
Object.getOwnPropertyDescriptor(Object.getPrototypeOf(window.location), 'href')
|
||||
? (window.location.href = href)
|
||||
: (window.location = href);
|
||||
}, 250);
|
||||
}
|
||||
|
||||
// 1) 拦截 <a> 标签点击
|
||||
document.addEventListener('click', function(e) {
|
||||
var link = e.target.closest('a[href]');
|
||||
if (!link) return;
|
||||
var href = link.getAttribute('href');
|
||||
// 跳过:锚点、javascript:、新窗口、带修饰键
|
||||
if (!href || href.startsWith('#') || href.startsWith('javascript') ||
|
||||
link.target === '_blank' || e.ctrlKey || e.metaKey || e.shiftKey) return;
|
||||
e.preventDefault();
|
||||
document.body.classList.add('page-leaving');
|
||||
setTimeout(function() { window.location.href = href; }, 250);
|
||||
});
|
||||
e.stopPropagation();
|
||||
doTransition(href);
|
||||
}, true); // 用捕获阶段,比 Vue 先拦截
|
||||
|
||||
// 2) 暴露全局函数供 Vue 调用(覆盖常见跳转方法)
|
||||
window.__navigateTo = function(href) { doTransition(href); };
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
@@ -16,11 +16,11 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<a href="/" class="back-home-link">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M19 12H5"/><path d="M12 19l-7-7 7-7"/></svg>
|
||||
返回首页
|
||||
</a>
|
||||
<div id="login" v-cloak>
|
||||
<a href="/" class="back-home-link">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M19 12H5"/><path d="M12 19l-7-7 7-7"/></svg>
|
||||
返回首页
|
||||
</a>
|
||||
<div class="login-container">
|
||||
<div class="login-jump-btn">
|
||||
<div class="lang-box">
|
||||
|
||||
@@ -11,12 +11,11 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<a href="/" class="back-home-link">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M19 12H5"/><path d="M12 19l-7-7 7-7"/></svg>
|
||||
返回首页
|
||||
</a>
|
||||
<div id="regist">
|
||||
|
||||
<a href="/" class="back-home-link">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M19 12H5"/><path d="M12 19l-7-7 7-7"/></svg>
|
||||
返回首页
|
||||
</a>
|
||||
<div class="login-container">
|
||||
<div class="login-jump-btn">
|
||||
<el-button type="primary" class="btn" v-if="commonData.login_register_redirect_show">
|
||||
|
||||
Reference in New Issue
Block a user