# Future
# Add heliosRX to your main.js
import Vue from 'vue'
import heliosRX from 'heliosRX'
import { rtdb1, rtdb2, rtdb3 } from './firebase' // Import realtime database
const db = heliosRX.setup({
// definitions: 'src/models',
userModels: 'src/models',
// userModels: requireContext('src/models'),
userModels: require.context('./models/', true, /\.model\.js$/ ),
userApi: 'src/api'
devMode: false,
debugLevel: heliosRX.DebugLevel.WARN,
firebaseDb: {
db1: rtdb1,
db2: rtdb2,
db3: rtdb3,
},
plugins: [],
// list of ready flags
})
new Vue({
...
render: h => h(App)
}).$mount('#app');
or
import Vue from 'vue'
import heliosRX from 'heliosRX'
Vue.use(heliosRX, {
definitions: 'src/models',
debug: false,
})
# Use heliosRX with existing Vuex Store
import { registryModule } from 'heliosrx'
const store = new Vuex.Store({
modules: {
// heliosrx: registryModule('heliosrx'),
heliosrx: registryModule(),
...
}
})
# Funtional API vs. Class API
# Functional
import { xxx } from 'heliosRX'
import { ref, state, computed } from 'vue'
export default {
setup() {
}
}
class CustomModel extends Model {
setup(props, ctx) {
// Why not use vue 3 api directly ??
const mygetter = computed(() => {
...
})
return { mygetter }
}
}
# Classes
class CustomModel extends Model {
setup() {
define_getter( this.mygetter );
}
computed: {
mygetter()
}
get mygetter() {
}
myaction(args) {
this.$models
this.$registry
}
}
class CustomCollection extends Collection {
myaction(args)
}
class CustomStore extends Store {
modelDefinition: {},
myaction() {
this.$registry
}
}
const example = new CustomStore('/example/*');