Git Product home page Git Product logo

vue-hooks's Introduction

vue-hooks NPM Version Bundle Size Build Status Code Coverage Total alerts Language grade: JavaScript Netlify Status

⚡️ Awesome Vue Hooks Fork From @u3u/vue-hooks

First of all, the original repository has no response for more features request, so I start this repository and add some common useful features. Welcome PRs.

Using @vue/composition-api to implement useful vue hooks.
Vue 3.0 has not been released yet, it allows you to use functional-based components in advance.

Another useful vue-hooks repository is vue-use-web, so some duplicated features will not implement here.

Install

yarn add @vue/composition-api @hanxx/vue-hooks

Documentation

Docs are available at https://vue-hooks.hanxx.icu

Usage

Now don't need Vue.use(hooks) to install plugin

// main.js
import Vue from 'vue';
import VueCompositionAPI from '@vue/composition-api';

Vue.use(VueCompositionAPI); // Don't forget to use the plugin!

If use useDate, remember installing dayjs

yarn add dayjs
// You can use dayjs directly here
import { useDate, dayjs } from '@hanxx/vue-hooks/lib/useDate';

If haven't use useDate, dayjs is not a necessary dependence

import { defineComponent } from '@vue/composition-api';
import { useWindowSize } from '@hanxx/vue-hooks';

export default defineComponent({
  setup() {
    const { width, height, widthPixel, heightPixel } = useWindowSize();
    return { width, height, widthPixel, heightPixel };
  },

  render() {
    const { width, height, widthPixel, heightPixel } = this;
    return (
      <div id="app" style={{ width: widthPixel, height: heightPixel }}>
        dynamic window size: {width}, {height}
      </div>
    );
  },
});

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b feat/new-hook
  3. Commit your changes: git commit -am 'feat(hooks): add a new hook'
  4. Push to the branch: git push origin feat/new-hook
  5. Submit a pull request :D

Contributors

Thanks goes to these wonderful people (emoji key):


u3u

💻 📖 💡 ⚠️

Han

💻

This project follows the all-contributors specification. Contributions of any kind are welcome!

License

MIT

vue-hooks's People

Contributors

allcontributors[bot] avatar dependabot-preview[bot] avatar lianghx-319 avatar pochodaydayup avatar semantic-release-bot avatar u3u avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

vue-hooks's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.