vue3 之 数据格式化函数

在很多项目中，都会有数据字典表，前端通过请求后端拿到数据字典表里的数据，一般在页面列表上面状态数据都会是返回的数字，前端需要把数字转换成字典表里对应的数据值，下面写了一个前端写死的数据，stateMap里的数据可以换成从接口请求过来的数据

<script setup>
  // 创建格式化函数
  const fomartPayState = (payState) => {
    const stateMap = {
      1: '待付款',
      2: '待发货',
      3: '待收货',
      4: '待评价',
      5: '已完成',
      6: '已取消'
    }
    return stateMap[payState]
  }
</script>
<template>
  <!-- 调用函数适配显示 -->
  <p>{{ fomartPayState(order.orderState)}}</p>
</template>