Essepage에서 Essepage.href() 함수로 링크 지정하기

Essepage에서 다른페이지에 링크를 지정하는 방법은 간단합니다.

페이지 링크 걸기

/about라는 페이지가 있다면, 다음과 같이 쓸 수 있습니다. HTML 표준 방법과 사용방법은 같습니다. 그러면 자동으로 Full URL 로 변환됩니다.

<a href="/about">About</a>

Essepage.href() 함수를 이용하여 링크 걸기

그런데 JavaScript로 링크를 지정해야 할 때에는 만들거나 할 때에는 직접 Full URL 을 지정해야 하는데, Essepage에서 현재 페이지 URL 가져오기 🌐✨ 의 방법도 있지만, Essepage.href() 함수를 사용하는 방법도 있다.

console.log(Essepage.href('/about'));

Alpine.js 에서 사용하는 예제

Alpine.js 등에서는 이 방법을 이용하면 깔끔하게 처리할 수 있다.

<ul x-data="{ pages: [{path: '/about', title: 'About'}, ...] }">
    <template x-for="page in pages">
        <li x-text="page">
            <a :href="Essepage.href(page.path)" x-text="page.title"></a>
        </li>
    </template>
</ul>

다국어 페이지에서도 사용 가능

또한 Essepage.href() 함수는 다국어 페이지도 지원하여 예를들어 한국어(ko)페이지에서 Essepage.href('/about')로 지정을 하면 /ko/about와 같이 언어 코드가 자동으로 추가된다.