a-badge组件计算color值

Question

  <a-badge :color="color" :text="computedStatus(record.rentStatus)"></a-badge>

const computedStatus = value => {
  switch (value) {
    case '1':
      color.value = 'green'
      return '进行中'
    case '2':
      color.value = 'red'
      return '已退租'
    case '3':
      color.value = 'gray'
      return '结束'
  }
}

这样写错在哪了？

Answer 1

该回答引用chatgpt:改成这样试试

<template>
  <a-badge :color="computedColor(record.rentStatus)" :text="computedStatus(record.rentStatus)"></a-badge>
</template>

<script>
export default {
  methods: {
    computedStatus(value) {
      switch (value) {
        case '1':
          return '进行中';
        case '2':
          return '已退租';
        case '3':
          return '结束';
        default:
          return '';
      }
    },
    computedColor(value) {
      switch (value) {
        case '1':
          return 'green';
        case '2':
          return 'red';
        case '3':
          return 'gray';
        default:
          return '';
      }
    },
  },
};
</script>