vue-settings
Vuex module for KodaDot app
Installation
yarn add @kodadot1/vue-settings
State Props
Name | Description |
---|---|
apiUrl | Selected Url |
i18nLang | Selected language |
locking | Selected Locking |
prefix | Prefix |
uiMode | UI Mode |
uiTheme | UI Theme |
avaibleOptions | Object of all avaible options |
Mutations
Name | Description | Params | Types |
---|---|---|---|
setSettings | Set settings | settings | SettingsStruct |
Getters
Name | Description | Returns |
---|---|---|
availableNodes | List of Nodes | Option[] |
availableLanguages | List of Languages | Option[] |
availableCryptos | List of Cryptographic modes | Option[] |
availableLocking | List of Locking | Option[] |
availablePrefixes | List of Prefixes | Option[] |
availableUiModes | List of UI Modes | Option[] |
availableUiThemes | List of UI Themes | Option[] |
getSettings | Object of all avaible options | SettingsStruct |
Usage Examples
import SettingModule
to your store as module
import Vue from 'vue'
import Vuex from 'vuex'
import SettingModule from '@vue-polkadot/vue-settings'
Vue.use(Vuex)
export default new Vuex.Store({
modules: {
setting: SettingModule,
},
})
now you can use getters and actions inside your component (Using Vue with typescript)
<template>
<div>
<div v-for="option in options">
<span>{{option.value}}</span>
<span>{{option.text}}</span>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
@Component
export default class App extends Vue {
// Getter is like computed
get options(): Option[] {
return this.$store.getters.availableNodes
}
}
</script>