@3yourmind/vue-hooks 中文文档教程
vue-hooks
⚡️ 很棒的 Vue 挂钩
使用 @vue/composition-api
实现有用的 Vue 挂钩。
Vue 3.0 还没有发布,它允许你提前使用基于功能的组件。
⚠️ 2.x 已经切换到 @vue/composition-api
,如果你使用的是 1.x 版本请使用 vue-function-api
Install
yarn add @vue/composition-api @u3u/vue-hooks
Documentation
文档位于 https://vue-hooks.netlify。 com
Usage
import Vue from 'vue';
import VueCompositionAPI from '@vue/composition-api';
import hooks from '@u3u/vue-hooks';
Vue.use(hooks);
Vue.use(VueCompositionAPI); // Don't forget to use the plugin!
import { createComponent } from '@vue/composition-api';
import { useWindowSize } from '@u3u/vue-hooks';
export default createComponent({
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>
);
},
});
Hooks
useWindowSize
— Trackswindow
dimensions.useCounter
— Tracks state of a number.usePrevious
— Returns the previous state or props.useRouter
— A hook forvue-router
.useStore
— A hook forvuex
.useState
— A hook formapState
.useGetters
— A hook formapGetters
.useMutations
— A hook formapMutations
.useActions
— A hook formapActions
.
Contributing
- Fork it!
- Create your feature branch:
git checkout -b feat/new-hook
- Commit your changes:
git commit -am 'feat(hooks): add a new hook'
- Push to the branch:
git push origin feat/new-hook
- Submit a pull request :D
Contributors
感谢这些优秀的人(emoji key):
u3u ???? ???? ???? ⚠️ |
这个项目遵循all-contributors规格。 欢迎任何形式的贡献!