SWR data fetching library for Alpine.js

This is basically port of SWRV library for Vue 3

Installation

1. Install the library

npm i alpine-swr

2. Register custom Alpine.js magic property

import swr from "alpine-swr";

Alpine.magic('swr', swr)

Usage

<div x-data="{todos: $swr('https://jsonplaceholder.typicode.com/todos')}">
    <p x-show="!todos.data">Loading...</p>
    <div x-show="todos.data">
        <template x-for="todo in todos.data" :key="todo.id">
            <p>Title: <span x-text="todo.title"></span></p>
        </template>
    </div>
</div>

TODO (For now you can refer to the original documentation swrv)