uniapp创建一个商品页，从后端项目中获取商品信息，并显示在页面上。 后端项目访问路径：http://10.8.12.150:8088/ajaxtest/goods 得到的数据是JSON格式的数组， 商品属性包含：id,goodsName,price,spec,about 分别对应商品的编号，商品名称，价格，规格，简介 后端项目可访问的接口包含：下面的接口可用作代码测试 http://10.8.12.150:8088/ajaxtest/json,可得到一个JSON格式的数据，包含name,address,age三个属性 http://10.8.12.150:8088/ajaxtest/post,可得到一个字符串

首先，在uniapp中创建一个商品页，可以使用vue的组件化思想来实现。在页面上添加一个组件，命名为GoodsList，然后在GoodsList.vue文件中编写以下代码：

<template>
  <div>
    <div v-for="goods in goodsList" :key="goods.id">
      <h3>{{ goods.goodsName }}</h3>
      <p>价格：{{ goods.price }}</p>
      <p>规格：{{ goods.spec }}</p>
      <p>简介：{{ goods.about }}</p>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      goodsList: [],
    };
  },
  mounted() {
    this.getGoodsList();
  },
  methods: {
    getGoodsList() {
      uni.request({
        url: "http://10.8.12.150:8088/ajaxtest/goods",
        success: (res) => {
          this.goodsList = res.data;
        },
      });
    },
  },
};
</script>

在代码中，我们通过使用uni的request方法来获取后端接口中的商品信息，并将其赋值给goodsList数组。然后，在页面上使用v-for指令遍历goodsList数组，将每个商品的属性渲染到页面上。

接下来，在App.vue文件中引入GoodsList组件，添加以下代码：

<template>
  <div>
    <goods-list></goods-list>
  </div>
</template>

<script>
import GoodsList from "@/components/GoodsList";

export default {
  components: {
    GoodsList,
  },
};
</script>

这样，当我们在浏览器中访问uniapp的页面时，就可以从后端项目中获取商品信息，并显示在页面上了。