如何使用Mapstate映射此数据

Question

我可以从this.$store.state.workermanage.staff.staff中获取数据

但是如何使用... mapstate来交换此代码，谢谢

persons: this.$store.state.workermanage.staff.staff

Answer 1

为store.js中的嵌套getter对象创建staff

const store = new Vuex.Store({
  state: {
    workmanage: {
        staff: {
            staff: {

            } 
        }
    }
  },
  getters: {
    nestedStaff: state => {
      return state.workamage.staff.staff
    }
  }
})

在组件中使用吸气剂：

import { mapGetters } from 'vuex'

export default {
  computed: {
    ...mapGetters([
      'nestedStaff'
    ])
  }
}

之后，您可以使用nestedStaff，因为它是一个简单的计算属性。

Answer 2

computed: {
  ...mapState({ persons: state => state.workermanage.staff.staff })
}

并且使用类似：

{{ persons }}

Answer 3

import { mapState } from 'vuex'

export default {
  computed: ...mapState({
    staff: state => state.workermanage.staff.staff,
  })
}

...应该起作用。

如果需要输入，假设职员是Staff[]类型

import { mapState } from 'vuex';
import { store } from './path/to/store'
import { Staff } from './path/to/types'

export default {
  computed: ...mapState({
    staff: (state: typeof store.state): Staff[] => state.workermanage.staff.staff,
  })
}