vue如何将查到的数据上传到前端展示

要将查到的数据上传到前端展示，可以使用Vue.js的数据绑定功能。数据绑定是Vue.js的核心特性之一，它可以将数据和页面元素相互关联起来，使得数据的变化能够自动反映在页面上。

具体步骤如下：

1. 在Vue组件中定义一个data属性，用来存储从后端获取到的数据。

2. 在组件的created钩子函数中，调用后端接口获取数据，并将数据保存到data属性中。

3. 在组件的模板中，通过双花括号语法（{{}}）将data属性中的数据绑定到页面元素上。

例如，假设我们要在页面上展示一个用户列表，可以按照以下步骤进行：

1. 在Vue组件中定义一个data属性，用来存储从后端获取到的数据：

export default {
    data() {
        return {
            userList: [] // 用来存储用户列表数据
        }
    },
    ...
}

2. 在组件的created钩子函数中，调用后端接口获取数据，并将数据保存到data属性中：

export default {
    data() {
        return {
            userList: [] // 用来存储用户列表数据
        }
    },
    created() {
        axios.get('/api/users')
            .then(response => {
                this.userList = response.data // 将从后端获取到的数据保存到data属性中
            })
            .catch(error => {
                console.log(error)
            })
    },
    ...
}

3. 在组件的模板中，通过双花括号语法（{{}}）将data属性中的数据绑定到页面元素上：

<template>
    <div>
        <ul>
            <li v-for="user in userList" :key="user.id">{{ user.name }}</li>
        </ul>
    </div>
</template>

在上面的例子中，我们使用了v-for指令将userList中的每个用户数据都遍历出来，并使用:key绑定了每个用户的id，以提高渲染性能。同时，我们在li标签中使用了双花括号语法将每个用户的name属性绑定到页面上。这样，当data属性中的数据发生变化时，页面上的用户列表也会自动更新。