Получение множества ошибок при попытке доступа к состоянию в vuex-module-decorators и @MutationAction не запускается - PullRequest
Новая
       9

Получение множества ошибок при попытке доступа к состоянию в vuex-module-decorators и @MutationAction не запускается

0 голосов
/ 04 февраля 2020

Я пытаюсь получить доступ к состоянию внутри @MutationAction в одном из модулей моего магазина. Всякий раз, когда я пытаюсь получить к нему прямой доступ с помощью объекта «this», он дает мне неопределенное значение, поэтому я сделал несколько функций получения и использовал их для доступа к переменной в том состоянии, которое мне хотелось бы. Тем не менее, это выдает ошибки, но все еще работает. Точная ошибка: «Свойство sortBy не существует для типа« Getter, any> ».» Эта ошибка выдается каждый раз, когда я хочу получить доступ к члену состояния в @MutationAction. Код модуля приведен ниже. 

import { Module, VuexModule, Mutation, MutationAction } from 'vuex-module-decorators'
import { websocket } from 'src/boot/socket.io-client'
import { AcademicProgramPagination } from './types'

@Module({
  name: 'academicProgram',
  namespaced: true
})
export default class AcademicProgam extends VuexModule {
  data: any = []

  public pagination: AcademicProgramPagination = {
    descending: false,
    page: 1,
    rowsNumber: 0,
    rowsPerPage: 10,
    sortBy: 'name'
  }

  public filter: string = ''

  get getpagination (): AcademicProgramPagination {
    return this.pagination
  }

  get getfilter (): string {
    return this.filter
  }

  @Mutation
  public setData(data: any) {
    this.data = data
  }

  @Mutation
  public setRowNumber(rowNumber: number) {
    this.pagination.rowsNumber = rowNumber
  }

  @MutationAction
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  public async fetch(): Promise<any> {
    const dir = this.getters.getpagination
    const filter = this.getters.getfilter
    //console.log("inside action")
    const orderBy = dir.sortBy ? `order: {
        by: ${dir.sortBy}
        dir: ${dir.descending ? 'DESC' : 'ASC'}
    }` : ''
    console.log("right before query")
    websocket.emit('query', `{
    academicPrograms(page:{
        skip: ${(dir.page - 1) * dir.rowsPerPage},
        first: ${dir.rowsPerPage}
    }
    filter: {
        ilike: {
            name: "${filter}"
        }
    }
    ${orderBy}
    ) {
      pagination {
        total
        listTotal
      }
      list {
        id
        name
        code
        type {
          value: id
          label: name
        }
        status {
          value: id
          label: name
        }
      }
    }
}`, (response: { errors: any; data: { academicPrograms: { list: any; pagination: { total: number } } } }) => {
    if (!response.errors) {
        console.log("reached response part")
        console.log(response.data.academicPrograms.list + "and" + response.data.academicPrograms.pagination.total) 
        this.setData(response.data.academicPrograms.list)
        this.setRowNumber(response.data.academicPrograms.pagination.total)
      }
    })
  }
}

Следующая ошибка, которую я получаю при выполнении этого запроса, выглядит следующим образом:

TypeError: Невозможно преобразовать неопределенное или нулевое в объект

at Function.keys ()

на Store.mutation (индекс. js? 6fc5: 464)

на wrappedMutationHandler (vuex.esm. js? 2f62: 740)

в commitIterator (vuex.esm. js? 2f62: 392)

в Array.forEach ()

в eval (vuex.esm. js? 2f62 : 391)

в Store._withCommit (vuex.esm. js? 2f62: 522)

в Store.commit (vuex.esm. js? 2f62: 390)

в Store.boundCommit (vuex.esm. js? 2f62: 335)

в Object.local.commit (vuex.esm. js? 2f62: 692)

РЕДАКТИРОВАТЬ: Я полагаю, что ошибка может быть вызвана вызовом компонента vue, на котором я его использую. Строка кода ниже: 

@AcademicProgramStore.Action
private fetch!: () => void

mounted() {
  this.fetch()
}
...