vue3中的vue-18n的table表格标题不动态变化中英文

发布时间 2023-11-13 19:46:49作者: 流浪のwolf

使用 computed 即可

 

eg:

const columns = computed(() => {
  return  reactive<any>([
  {
    title: proxy.$t('device.pm.table.index'),
    dataIndex: 'index',
    width: 50,
    slotName: 'indexsort',
    ellipsis: true,
    tooltip: true,
  },
  {
    title: proxy.$t('device.pm.table.deviceName'),
    dataIndex: 'deviceName',
    width: 100,
    ellipsis: true,
    tooltip: true,
  },
  {
    title: proxy.$t('device.pm.table.departmentName'),
    dataIndex: 'departmentName',
    slotName: 'depName',
    width: 200,
    ellipsis: true,
    tooltip: true,
  },
  {
    title: proxy.$t('device.pm.table.deviceTypeName'),
    dataIndex: 'deviceTypeName',
    width: 100,
    ellipsis: true,
    tooltip: true,
  },
  {
    title: proxy.$t('device.pm.table.manufacturerName'),
    dataIndex: 'manufacturerName',
    width: 100,
    ellipsis: true,
    tooltip: true,
  },
  {
    title: proxy.$t('device.pm.table.modelNumber'),
    dataIndex: 'modelNumber',
    width: 100,
    ellipsis: true,
    tooltip: true,
  },
  {
    title: proxy.$t('device.pm.table.reminderTime'),
    dataIndex: 'reminderTime',
    width: 150,
    ellipsis: true,
    tooltip: true,
  },
  {
    title: proxy.$t('device.pm.table.period'),
    dataIndex: 'period',
    width: 100,
    ellipsis: true,
    tooltip: true,
  },
  {
    title: proxy.$t('device.pm.table.countdown'),
    dataIndex: 'countdown',
    width: 110,
    ellipsis: true,
    tooltip: true,
  },
  {
    title: proxy.$t('operate'),
    width: 200,
    align: 'center',
    dataIndex: 'manufacturerName',
    slotName: 'operation',
    ellipsis: true,
    tooltip: true,
    fixed: 'right',
  },
]);
})