后端返回名称和排名的数组，vue如何通过名称查找对应排名

可以使用Vue的计算属性来实现根据名称查找对应排名的功能。具体实现步骤如下：

1. 在Vue的data中定义一个数组，存储后端返回的名称和排名数据。

2. 在Vue的computed中定义一个计算属性，接收一个名称参数，返回对应名称的排名。在计算属性中，可以使用数组的find方法查找对应名称的排名。

3. 在Vue的模板中，可以通过v-model绑定一个输入框，让用户输入名称。然后在模板中使用计算属性来获取对应名称的排名，并展示给用户。

下面是一个示例代码：

<template>
  <div>
    <input v-model="name" placeholder="请输入名称">
    <div>{{ name }} 的排名是 {{ rank }}</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      data: [
        { name: '张三', rank: 1 },
        { name: '李四', rank: 2 },
        { name: '王五', rank: 3 },
      ],
      name: '',
    }
  },
  computed: {
    rank() {
      return this.data.find(item => item.name === this.name)?.rank
    },
  },
}
</script>

在上面的示例代码中，使用了ES6的可选链语法，防止在data中没有找到对应名称的排名时，出现异常。