https://github.com/reduxjs/vue-redux

Official Vue bindings for Redux
https://github.com/reduxjs/vue-redux

redux vue

Last synced: 2 days ago
JSON representation

Official Vue bindings for Redux

• Host: GitHub
• URL: https://github.com/reduxjs/vue-redux
• Owner: reduxjs
• License: mit
• Created: 2024-09-02T10:03:03.000Z (25 days ago)
• Default Branch: main
• Last Pushed: 2024-09-15T10:09:51.000Z (12 days ago)
• Last Synced: 2024-09-25T01:20:23.484Z (2 days ago)
• Topics: redux, vue
• Language: TypeScript
• Homepage:
• Size: 448 KB
• Stars: 19
• Watchers: 1
• Forks: 1
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        
# Vue Redux

Official Vue bindings for [Redux](https://github.com/reduxjs/redux).

Performant and flexible.

![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/reduxjs/vue-redux/test.yml?style=flat-square) [![npm version](https://img.shields.io/npm/v/@reduxjs/vue-redux.svg?style=flat-square)](https://www.npmjs.com/package/@reduxjs/vue-redux)

[![npm downloads](https://img.shields.io/npm/dm/@reduxjs/vue.svg?style=flat-square)](https://www.npmjs.com/package/@reduxjs/vue-redux)

> [!WARNING]

> This package is in alpha and is rapidly developing.

## Installation

Vue Redux requires **Vue 3 or later**.

To use React Redux with your Vue app, install it as a dependency:

```bash

# If you use npm:

npm install @reduxjs/vue-redux

# Or if you use Yarn:

yarn add @reduxjs/vue-redux

```

You'll also need to [install Redux](https://redux.js.org/introduction/installation) and [set up a Redux store](https://redux.js.org/recipes/configuring-your-store/) in your app.

This assumes that you’re using [npm](http://npmjs.com/) package manager

with a module bundler like [Webpack](https://webpack.js.org/) or

[Browserify](http://browserify.org/) to consume [CommonJS

modules](https://webpack.js.org/api/module-methods/#commonjs).

# Usage

The following Vue component works as-expected:

```vue

import { useSelector, useDispatch } from '@reduxjs/vue-redux'

import { decrement, increment } from './store/counter-slice'

import { RootState } from './store'

const count = useSelector((state: RootState) => state.counter.value)

const dispatch = useDispatch()

  


    


      

        Increment

      

      {{ count }}

      

        Decrement

      

    

  


```