vhooks

Easy use Vue composition-api

Features

• 🚀 All data is reactive
• 🤖 Automatic error retry

Install

npm install @baishan/vhooks

# or with yarn
yarn add @baishan/vhooks

CDN use

<script src="https://unpkg.com/@baishan/vhooks"></script>

Usage

import { reactive } from 'vue';
import vhooks from '@baishan/vhooks';

const request = (params) => {
    return axios.get('/api/v1/users', { params });
}

const params = reactive({
    pageSize: 10,
    current: 1,
    total: 0,
});
// Array, reload function, loading state
const [dataSource, reload, loading] = vhooks.useFetchData({ params, request });

useCounter

import { createCounter } from '@baishan/vhooks';

const counter = createCounter(-1);

app.use(counter)


// component
import { useCounter } from '@baishan/vhooks';
const [get] = useCounter();

const v = get(); // number

useFullscreen (1.0.7+)

<script setup>
import { useFullscreen } from '@baishan/vhooks';

const [elRef, state, { setFull, exitFull, toggleFull }] = useFullscreen();

// call setFull() 
// call exitFull()
</script>

<template>
    <button @click="toggleFull">
    <div ref="elRef">
        <p>demo</p>
    </div>
</template>