/vuexfiresql

FireSQL bindings for Vuex

Primary LanguageTypeScriptMIT LicenseMIT

VuexFireSQL npm version

FireSQL bindings for Vuex

Installation

yarn add vuexfiresql
# or
npm install --save vuexfiresql

Usage

Nuxt.js

Due to the order code is loaded in, vuexfiresql must be included as a NuxtJS plugin:

// nuxt.config.js

...
plugins: [{ src: '~/plugins/vuexfiresql.js', ssr: false }]
...
// ~/plugins/vuexfiresql.js

import { vuexFireSQL } from 'vuexfiresql'

export default ({ store }) => {
  vuexFireSQL('http://localhost:8080')(store)
}

// You can inject db instance, too.
// export default ({ store }, inject) => {
//   const db = vuexFireSQL('http://localhost:8080')(store)
//   inject('db', db)
// }
// this.$db.table('messages').select()

Add the actions and mutations to your root Store:

// ~/store/index.js

import { vuexfiresqlActions, vuexfiresqlMutations } from 'vuexfiresql'

export const state = () => ({
  counter: 0
})

export const mutations = {
  increment(state) {
    state.counter++
  },
  ...vuexfiresqlMutations
}

export const actions = {
  ...vuexfiresqlActions
}

Specifies the vuex state you want to sync.

// equal the following
// SELECT json FROM json WHERE id = 10
this.$store.dispatch('SYNC_STATE', {
    table: 'json',
    pkColumnName: 'id',
    pk: 101,
    jsonColumnName: 'json'
})