html+vue 商城列表前端从后端拿到list数组显示在前端

好的，这是一个常见的前后端交互问题，我们可以通过以下步骤来实现：

1. 在后端编写接口，用于获取商品列表数据。可以使用RESTful API或其他API方式来实现，返回一个包含商品列表的JSON格式数据。

2. 在前端使用Vue框架，使用axios库来异步请求后端接口，并将获取到的商品列表数据存储在Vue实例的data属性中。

3. 在Vue实例的template中，使用v-for指令遍历data属性中的商品列表数据，并展示在页面上。

下面是一个简单的示例代码：

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

<script>
import axios from 'axios';

export default {
  data() {
    return {
      list: []
    }
  },
  mounted() {
    axios.get('/api/products')
      .then(response => {
        this.list = response.data;
      });
  }
}
</script>

在上面的代码中，我们使用了axios库来发起GET请求，获取后端提供的商品列表数据，然后将其存储在Vue实例的data属性中的list属性中。最后，我们使用v-for指令来遍历list属性中的数据，并将其展示在页面上。