npmpackage.info

Gathering detailed insights and metrics for vuex-router-sync

Other packages similar to vuex-router-sync

nuxt-vuex-router-sync

0.0.3

vuex-router-sync integration for Nuxt

vuex-enhanced-router-sync

1.0.0

This package replaces vuex-router-sync and adds some useful features.

react-router-redux

4.0.8

Ruthlessly simple bindings to keep react-router and redux in sync

next-router-mock

0.9.13

Mock implementation of the Next.js Router

Gathering detailed insights and metrics for vuex-router-sync

vuex-router-sync

Effortlessly keep vue-router and vuex store in sync.

5.0.0

2,515

MIT

JavaScript

25,829,179 2.6

Installations

npm install vuex-router-sync

Pull Requests

Open

3

Total

34

Closed

11

Merged

20

Issues

Open

8

Total

73

Closed

65

Releases

v6.0.0-rc.1

Published on 05 Feb 2021

v5.0.0

Published on 12 Oct 2017

v4.1.0

Published on 02 Jan 2017

v4.0.0

Published on 14 Dec 2016

v2.0.0

Published on 30 Jun 2016

View all 5 releases

Developer

vuejs

Developer Guide

BETA

Module System

CommonJS

Min. Node Version

Typescript Support

No

Node Version

8.4.0

NPM Version

5.4.1 Statistics

2,515 Stars

79 Commits

125 Forks

48 Watching

4 Branches

85 Contributors

Updated on 11 Oct 2024

Languages

JavaScript (57.43%)

TypeScript (42.57%)

Total Downloads

Cumulative downloads

Total Downloads

25,829,179

Last day

-10.8%

15,167

Compared to previous day

Last week

-2.8%

83,182

Compared to previous week

Last month

33%

351,900

Compared to previous month

Last year

-19.6%

3,523,474

Compared to previous year

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Peer Dependencies

vue-router vuex

Dev Dependencies

buble jest typescript vue vue-router vuex

Versions

Vuex Router Sync

Sync Vue Router's current $route as part of Vuex store's state.

中文版本 (Chinese Version)

Usage

1# the latest version works only with vue-router >= 2.0
2npm install vuex-router-sync
3
4# for usage with vue-router < 2.0:
5npm install vuex-router-sync@2

1import { sync } from 'vuex-router-sync'
2import store from './store' // vuex store instance
3import router from './router' // vue-router instance
4
5const unsync = sync(store, router) // done. Returns an unsync callback fn
6
7// bootstrap your app...
8
9// During app/Vue teardown (e.g., you only use Vue.js in a portion of your app
10// and you navigate away from that portion and want to release/destroy
11// Vue components/resources)
12unsync() // Unsyncs store from router

You can optionally set a custom vuex module name:

1sync(store, router, { moduleName: 'RouteModule' } )

How does it work?

It adds a route module into the store, which contains the state representing the current route:

1store.state.route.path   // current path (string)
2store.state.route.params // current params (object)
3store.state.route.query  // current query (object)

When the router navigates to a new route, the store's state is updated.
store.state.route is immutable, because it is derived state from the URL, which is the source of truth. You should not attempt to trigger navigations by mutating the route object. Instead, just call $router.push() or $router.go(). Note that you can do $router.push({ query: {...}}) to update the query string on the current path.

License

MIT

No vulnerabilities found.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

10

Dangerous-Workflow

Determines if the project's GitHub Action workflows avoid dangerous patterns.

10

License

Determines if the project has defined a license.

1

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Maintained

Determines if the project is "actively maintained".

0

Token-Permissions

Determines if the project's workflows follow the principle of least privilege.

0

Pinned-Dependencies

Determines if the project has declared and pinned the dependencies of its build process.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

SAST

Determines if the project uses static code analysis.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Score

2.6

/10

Last Scanned on 2024-11-18

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More