# 페이지 링크를 클릭할 때, 페이지 콘텐츠가 로드되기 전에 JavaScript를 실행하려면?

**URL:** https://meta.discourse.org/t/trigger-javascript-on-clicking-any-page-link-but-before-the-page-content-loads/167970
**Category:** Development
**Created:** [10월 22, 2020, 3:13오후 UTC](https://meta.discourse.org/t/trigger-javascript-on-clicking-any-page-link-but-before-the-page-content-loads/167970 "2020-10-22T15:13:01Z")
**Posts on this page:** 1
**Showing post:** 2

<div class="post-metadata">

### Author: ![Johani](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/johani/32/176920_2.png) [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [10월 22, 2020, 6:12오후 UTC](https://meta.discourse.org/t/trigger-javascript-on-clicking-any-page-link-but-before-the-page-content-loads/167970/2 "2020-10-22T18:12:43Z")

</div>

안녕하세요 👋

기억하기로는 이전에 이런 요청이 있었던 적이 없어, 현재 Plugin-API에는 페이지 전환 전에 스크립트를 실행할 수 있는 방법이 없습니다.

그럼에도 불구하고, 애플리케이션 루트에서 `willTransition()` 액션을 활용할 수 있습니다.

> <https://github.com/discourse/discourse/blob/52672b9eabccb1184d85dc7f08062d5a7c18cb73/app/assets/javascripts/discourse/app/routes/application.js#L61-L64>

테마/컴포넌트에서 다음과 같은 코드를 사용할 수 있습니다.

```javascript
// 이것은 전환 후에 실행됩니다
api.onPageChange((url, title) => {
  console.log("after transition");
});

// 이것은 전환 직전에 실행됩니다
api.modifyClass("route:application", {
  pluginId: "some-name",
  actions: {
    willTransition() {
      // 먼저 코어 코드를 실행합니다
      this._super(...arguments);
      // 그 다음 작업을 수행합니다
      console.log("before transition");
      // _router와 같이 사용할 수 있는 데이터를 확인하기 위해 다음과 같은 것도 할 수 있습니다
      console.log(this)
    }
  }
});

```

---

_[View the full topic](https://meta.discourse.org/t/trigger-javascript-on-clicking-any-page-link-but-before-the-page-content-loads/167970)._
