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>
|
<script>
|
||||||
(function() {
|
(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) {
|
document.addEventListener('click', function(e) {
|
||||||
var link = e.target.closest('a[href]');
|
var link = e.target.closest('a[href]');
|
||||||
if (!link) return;
|
if (!link) return;
|
||||||
var href = link.getAttribute('href');
|
var href = link.getAttribute('href');
|
||||||
// 跳过:锚点、javascript:、新窗口、带修饰键
|
|
||||||
if (!href || href.startsWith('#') || href.startsWith('javascript') ||
|
if (!href || href.startsWith('#') || href.startsWith('javascript') ||
|
||||||
link.target === '_blank' || e.ctrlKey || e.metaKey || e.shiftKey) return;
|
link.target === '_blank' || e.ctrlKey || e.metaKey || e.shiftKey) return;
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
document.body.classList.add('page-leaving');
|
e.stopPropagation();
|
||||||
setTimeout(function() { window.location.href = href; }, 250);
|
doTransition(href);
|
||||||
});
|
}, true); // 用捕获阶段,比 Vue 先拦截
|
||||||
|
|
||||||
|
// 2) 暴露全局函数供 Vue 调用(覆盖常见跳转方法)
|
||||||
|
window.__navigateTo = function(href) { doTransition(href); };
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
@@ -16,11 +16,11 @@
|
|||||||
<div class="ddr ddr5"></div>
|
<div class="ddr ddr5"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="template">
|
<div class="template">
|
||||||
<div id="login" v-cloak>
|
|
||||||
<a href="/" class="back-home-link">
|
<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>
|
<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>
|
</a>
|
||||||
|
<div id="login" v-cloak>
|
||||||
<div class="login-container">
|
<div class="login-container">
|
||||||
<div class="login-jump-btn">
|
<div class="login-jump-btn">
|
||||||
<div class="lang-box">
|
<div class="lang-box">
|
||||||
|
|||||||
@@ -11,12 +11,11 @@
|
|||||||
<div class="ddr ddr5"></div>
|
<div class="ddr ddr5"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="template">
|
<div class="template">
|
||||||
<div id="regist">
|
|
||||||
|
|
||||||
<a href="/" class="back-home-link">
|
<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>
|
<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>
|
</a>
|
||||||
|
<div id="regist">
|
||||||
<div class="login-container">
|
<div class="login-container">
|
||||||
<div class="login-jump-btn">
|
<div class="login-jump-btn">
|
||||||
<el-button type="primary" class="btn" v-if="commonData.login_register_redirect_show">
|
<el-button type="primary" class="btn" v-if="commonData.login_register_redirect_show">
|
||||||
|
|||||||
Reference in New Issue
Block a user