[ {"id":1,"count":"5.4万","goodsName":"春季上新","goodsPic":"http://60.187.68.190/goods/img/img1"}, {"id":2,"count":"5.3万","goodsName":"猫","goodsPic":"http://60.187.68.190/goods/img/mao.png"}, {"id":3,"count":"1.4万","goodsName":"猫2","goodsPic":"http://60.187.68.190/goods/img/mao2"}, {"id":4,"count":"1.6万","goodsName":"xie1","goodsPic":"http://60.187.68.190/goods/img/xie1"}, {"id":5,"count":"0.4万","goodsName":"xie2","goodsPic":"http://60.187.68.190/goods/img/xie2"}, {"id":6,"count":"3.3万","goodsName":"饮料","goodsPic":"http://60.187.68.190/goods/img/yinliao"} ]
时间: 2023-08-16 13:05:43 浏览: 40
这段代码是一个JSON格式的字符串,表示一个商品列表。这个列表包含了多个商品,每个商品都有一个ID、一个数量、一个名称和一个图片URL。
其中,每个商品都是一个对象,用花括号{}括起来,每个对象之间用逗号,分隔。
对象中的属性用键值对表示,用冒号:分隔。例如"id":1表示该商品的ID是1。
整个JSON字符串用方括号[]括起来,表示一个数组。这个数组中包含了所有的商品对象。
相关问题
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的页面时,就可以从后端项目中获取商品信息,并显示在页面上了。
var addressList = { goodsName: goodsName, goodsDesc: goodsDesc, newPrice: newPrice, oldPrice: oldPrice, authorName: app.globalData.userInfo.nickName }
这是一个 JavaScript 对象,包含了商品名称、商品描述、新旧价格、以及作者名称等属性。这个对象可以用于将这些信息传递给后端服务器或者前端页面进行展示。其中,`goodsName`、`goodsDesc`、`newPrice`、`oldPrice`、`app.globalData.userInfo.nickName` 都是变量,需要先定义或者获取它们的值。
相关推荐
![](https://img-home.csdnimg.cn/images/20210720083646.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![doc](https://img-home.csdnimg.cn/images/20210720083327.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)