根据给出的代码和要求,可以通过判断用户角色来显示不同的选项。在代码中添加一个变量来表示用户角色,然后根据角色来渲染选项列表。

首先,在data中添加一个变量用来表示用户角色:

data() {
  return {
    role: 'boss', // 默认为老板角色
    optionList: [
      {
        optionId: 1,
        name: '店员管理',
        img: '../../static/staff.png',
      },
      {
        optionId: 2,
        name: '店铺信息修改',
        img: '../../static/shop.png',
      }
    ],
  }
},

然后,在模板中使用v-if指令来根据角色来判断是否显示选项:

<view class="wrap">
  <block v-for="(item, index) in optionList" :key="index">
    <view class="wrap-item" v-if="role === 'boss' || item.name !== '店员管理'" @click="toOption(item)">
      <image :src="item.img" mode=""></image>
      <view class="name">
        {{item.name}}
      </view>
    </view>
  </block>
</view>

这样,当角色为老板时,店员管理选项会被隐藏,当角色为店员时,店铺信息修改选项会被隐藏


原文地址: https://www.cveoy.top/t/topic/iyIt 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录