Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/django/19.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Vuex getter在组件中获取用户角色_Javascript_Firebase_Vue.js - Fatal编程技术网

Javascript Vuex getter在组件中获取用户角色

Javascript Vuex getter在组件中获取用户角色,javascript,firebase,vue.js,Javascript,Firebase,Vue.js,我是Vue.js Vuex和Firebase的新手,我尝试根据用户角色显示不同的导航栏项。 我目前正在从Firebase获取用户数据作为对象,并将其传递到存储 我尝试在vuex中使用getter来检查用户角色,只有当用户作为“admin”角色时,它才起作用 以下是我的收获: isAuthenticated (state) { return state.user }, userAuth: state => state.user.roles === 'thinker'|| 'e-libre

我是Vue.js Vuex和Firebase的新手,我尝试根据用户角色显示不同的导航栏项。 我目前正在从Firebase获取用户数据作为对象,并将其传递到存储

我尝试在vuex中使用getter来检查用户角色,只有当用户作为“admin”角色时,它才起作用

以下是我的收获:

isAuthenticated (state) {
  return state.user
},
userAuth: state => state.user.roles === 'thinker'|| 'e-libre' || 'hacker' || 'admin',
reviewerAuth: state => state.user.roles === 'reviewer' || 'admin',
devAuth: state => state.user.roles === 'dev' || 'admin',
adminAuth: state => state.user.roles === 'admin',
我希望这些函数在我的组件的computed属性中返回一个布尔值,这样我就可以检查用户是admin还是example reviewer,这样我就可以显示不同的项

这是我的计算函数

computed: {
app$(): IApp {
  return this.$store.state;
},
isAuthenticated () {
  return this.$store.getters.isAuthenticated
},
adminAuth () {
  return this.$store.getters.adminAuth
},
reviewerAuth () {
  return this.$store.getters.reviewerAuth
},
然后,我不知道为什么当用户角色是“admin”而不是当用户作为另一个角色时,这个函数可以正常工作

adminItems () {
    if (this.adminAuth) {
      return [
        { text: 'Admin', icon: 'lock', subheader: 'admin',
          children: [
            { text: 'Management', route: '/management', icon: ''},
            { text: 'Settings', route: '/settings', icon: ''}
          ]
        }
      ]
    }
}
例如,当用户作为角色审阅者时,reviewerAuth返回undefined:

 <v-list-tile v-if="!adminAuth||!reviewerAuth" to="/" avatar>
          <v-list-tile-avatar>
          <v-icon>translate</v-icon>
          </v-list-tile-avatar>
          <v-list-tile-content>
            <v-list-tile-title>Devenir reviewer</v-list-tile-title>
          </v-list-tile-content>

        </v-list-tile>
        <v-divider v-if="!adminAuth||!reviewerAuth"></v-divider>
        <v-list-tile
        v-for="(item, index) in userItems"
        :key="index"
        :to="item.path"
        avatar
        @click="">
        <v-list-tile-avatar>
        <v-icon>{{ item.icon }}</v-icon>
        </v-list-tile-avatar>
          <v-list-tile-title>{{ item.title }}</v-list-tile-title>

        </v-list-tile>

翻译
Devenir审查员
{{item.icon}
{{item.title}
我错过了什么?我同时也在学习javascript,感觉自己做得完全错误

非常感谢你的帮助


Philmo

您有一个简单的问题,检查的语法不正确。考虑

1==2 | |“你好”
这将返回:
hello

同样,您也有一个类似的错误:

userAuth:state=>state.user.roles=='thinker'| | | e-libre'| | | hacker'| | admin',
reviewerAuth:state=>state.user.roles===“审阅者”| |“管理员”,
devAuth:state=>state.user.roles===“dev”| |“admin”,
adminAuth:state=>state.user.roles==='admin',
应改为:

userAuth:state=>state.user.roles=='thinker'| | | | state.user.roles=='e-libre'| | | state.user.roles=='='hacker'| | | state.user.roles=='='admin',
reviewerAuth:state=>state.user.roles=='reviewer'| | state.user.roles==='admin',
devAuth:state=>state.user.roles=='dev'| | state.user.roles=='admin',
adminAuth:state=>state.user.roles==='admin',

非常感谢您的回答