[英]barba js v2 reinit main.js script
我正在努力使用 barba js v2。 ajaxtransition 后,我的 main.js 脚本停止工作。 我想以某种方式重新启动这个脚本......
我有这样简单的 barba 过渡->
import barba from "@barba/core"
class Transition {
constructor() {
// console.log(barba)
this.events()
}
events() {
// console.log("events")
barba.init({
transitions: [
{
name: "default-transition",
leave() {
// create your stunning leave animation here
console.log("leave")
},
enter() {
console.log("enter")
// create your amazing enter animation here
}
}
]
})
}
}
export default Transition
在</body>
标签的 and 我有
<script src="js/main-dist.js"></script>
</body>
在这个 main-dist.js 脚本中,还导入了几个其他脚本,例如显示当前日期的 function。
当我第一次 go 到该页面时,一切正常,但是当我 go 到另一个页面并返回应显示当前日期的页面时,由于脚本未初始化,日期未显示。 它仅在加载时初始化,而不是在 ajaxload 时初始化。
所以我的障碍是在 ajaxload 上以某种方式重新初始化这个脚本。
我想到了。 我们可以在转换脚本中使用 barba hook "after" :)
barba.hooks.after(() => {
const bottomDOM = document.getElementsByTagName("body")[0]
const newScript = document.createElement("script")
const oldScript = document.querySelector(".main-script")
newScript.src = "js/main-dist.js"
newScript.className = "main-script"
oldScript.remove()
bottomDOM.appendChild(newScript)
})
我在DOM的末尾有一个<script class="main-script" src="js/main-dist.js"></script>
,并使用 barba.hook 将其删除,然后再次添加
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.