网页链接跳转的记录

js打开外部链接的几种方式

1. 使用 location.href 跳转：
2. 使用location.replace：跳转这种方法会立即跳转到目标页面，并且不能使用浏览器的“返回”按钮返回原页面，因为该方法会覆盖浏览器的 history 记录。
3. 使用window.open()跳转：这个方法会打开一个新的浏览器窗口或者标签页，具体取决于浏览器的设置，也可以通过 window.open() 方法来设置新窗口的属性（如大小、位置、工具栏等）。

注意点：

window.location.href是一个操作浏览器地址栏的方法，它并不会直接触发页面的生命周期事件。但它会导致页面重新加载，因此重新加载后的页面会经历以下生命周期事件：

1. beforeunload事件：在页面销毁之前触发，可以用来处理一些页面关闭前的逻辑，例如提示用户确认是否要离开页面。

2. unload事件：在页面销毁后触发，可以用来处理一些页面销毁后的逻辑，例如清理一些资源。

3. load事件：在页面加载完成后触发，可以用来处理一些页面加载完成后的逻辑，例如发送一些异步请求、初始化一些组件等。

4. DOMContentLoaded事件：在页面DOM渲染完成后触发，可以用来处理一些与DOM相关的逻辑。通常比load事件更早触发，因为它不会等待页面所有资源都加载完成才触发。

需要注意的是，如果页面中使用了一些异步加载的资源（例如图片、脚本、样式等），这些资源的加载并不一定会在页面重新加载完成时都完成，因此可能还会触发一些其他的生命周期事件。

使用 `window.location.replace()` 方法跳转页面和使用 `window.location.href` 方法跳转页面一样，在直接使用这些方法进行页面跳转时不会触发 Vue 实例的任何生命周期钩子函数。

当使用 `window.location.replace()` 方法跳转到一个页面时，当前的 Vue 实例会被销毁，组件的所有状态数据都会被清除。在跳转页面后重新创建的 Vue 实例会触发生命周期函数 `created` 和 `mounted`。

需要注意的是，由于使用 `window.location.replace()` 方法进行页面跳转后，当前的 Vue 实例已被销毁，因此之前的所有组件状态都会被清除。如果你需要保留之前的 Vue 实例中的一些数据，在跳转到目标页面后可以通过浏览器缓存或者其他方式进行存储，在重新创建 Vue 实例时可以再次使用这些数据。