How to use the vuex-class.Getter function in vuex-class

To help you get started, we’ve selected a few vuex-class examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github emqx / MQTTX / src / views / connections / SubscriptionsList.vue View on Github external
@Component({
  components: {
    LeftPanel,
    MyDialog,
  },
})
export default class SubscriptionsList extends Vue {
  @Prop({ required: true }) public subsVisible!: boolean
  @Prop({ required: true }) public connectionId!: string
  @Prop({ required: true }) public record!: ConnectionModel
  @Prop({ type: String, default: '60px' }) public top!: string

  @Action('SHOW_SUBSCRIPTIONS') private changeShowSubscriptions!: (payload: SubscriptionsVisible) => void
  @Action('CHANGE_SUBSCRIPTIONS') private changeSubs!: (payload: Subscriptions) => void
  @Getter('activeConnection') private activeConnection: $TSFixed
  @Getter('currentTheme') private theme!: Theme

  private currentConnection: $TSFixed = {}
  private showDialog: boolean = false
  private subRecord: SubscriptionModel = {
    topic: 'testtopic/#',
    qos: 0,
  }
  private qosOption: qosList = [0, 1, 2]
  private subsList: SubscriptionModel[] = []

  get rules() {
    return {
      topic: { required: true, message: this.$t('common.inputRequired') },
      qos: { required: true, message: this.$t('common.selectRequired') },
    }
  }
github emqx / MQTTX / src / views / settings / index.vue View on Github external
import { Getter, Action } from 'vuex-class'
import { ipcRenderer } from 'electron'
import Leftbar from '@/components/Leftbar.vue'
import SettingsLeft from './SettingsLeft.vue'

@Component({
  components: {
    Leftbar,
    SettingsLeft,
  },
})
export default class Settings extends Vue {
  @Action('TOGGLE_THEME') private actionTheme!: (payload: { currentTheme: string }) => void
  @Action('TOGGLE_LANG') private actionLang!: (payload: { currentLang: string }) => void
  @Action('TOGGLE_AUTO_CHECK') private actionAutoCheck!: (payload: { autoCheck: boolean }) => void
  @Getter('currentTheme') private getterTheme!: 'light' | 'dark' | 'purple'
  @Getter('currentLang') private getterLang!: Language
  @Getter('autoCheck') private getterAutoCheck!: boolean

  private currentTheme: 'light' | 'dark' | 'purple' = 'light'
  private currentLang: Language = 'en'
  private autoCheck: boolean = false
  private langOptions: Options[] = [
    { label: '简体中文', value: 'zh' },
    { label: 'English', value: 'en' },
  ]
  private themeOptions: Options[] = [
    { label: 'Light', value: 'light' },
    { label: 'Dark', value: 'dark' },
    { label: 'Purple', value: 'purple' },
  ]

vuex-class

Binding helpers for Vuex and vue-class-component

MIT
Latest version published 5 years ago

Package Health Score

50 / 100
Full package analysis