在vue3中实现filters过滤器功能

vue3取消了vue2中的过滤器，但是变相一下，可以在双括号表达式中使用方法，所以也是可以间接实现的，功能简单，请看下面实例代码filters

<template>
  <div v-for="(item, index) in list" :key="index">
    <span>{{ item.name }}</span>
    <span>{{ filters(item.id) }}</span>
  </div>
</template>

<script>
export default {
  setup() {
    let list = [
      {
        name: "张三",
        id: 1,
      },
      {
        name: "李四",
        id: 2,
      },
      {
        name: "王五",
        id: 3,
      }
    ];
    
    function filters(id) {
      let txt = "";
      switch (id) {
        case 1:
          txt = "张三id";
          break;
        case 2:
          txt = "李四id";
          break;
        case 3:
          txt = "王五id";
          break;
      }
      return txt;
    }
    return {
      list,
      filters,
    };
  },
};
</script>