vue组件(盒子)动态循序位置

// 关联模块
import MainCard from './module/card'
import OrderRevenue from './module/orderRevenue' 
import SpaceField from './module/spaceField' 
import FieldSchedule from './module/fieldSchedule' 

import { mapGetters } from 'vuex'

export default {
  components: {
    Main: {
      computed: {
        ...mapGetters([
          'getDashboardRole' // 角色类型        1:位置1  2:位置2 3:位置3 4:位置4 5:位置5
        ])
      },
      render: function(createElement) {
       //  角色类型    1:位置1   2:位置2   -> 正常循序
       //                   4:位置4    5:位置5  -> 不正常循序
        let rule = [4, 5] // 不正常规则数组

        let normal = [ // 循序1
          createElement(MainCard), // 组件MainCard
          createElement(OrderRevenue), // 组件OrderRevenue
          createElement(SpaceField), // 组件SpaceField
          createElement(FieldSchedule) // 组件FieldSchedule
        ]

        let abnormal = [ //  循序2
          createElement(MainCard),  // 组件MainCard
          createElement(FieldSchedule), // 组件FieldSchedule
          createElement(SpaceField), // 组件SpaceField
          createElement(OrderRevenue) // 组件OrderRevenue
        ]
        return createElement('div', rule.includes(this.getDashboardRole) ? abnormal : normal)
      }
    }
  },

你可能感兴趣的:(vue组件(盒子)动态循序位置)