关于uniapp传参

学生assignment
遇到问题描述:我想通过点击导航条显示不同年级的内容,导航条都有各自的id,我在static目录下创建了.json文件,将数据写在里面。如何通过uni.request的data传参获取不同年级的数据,参数赋为导航条年级各自的id,
如图所示

img

data传参,如cid=50,就传一年级上册的内容

getGraCon() {
                uni.request({
                    url: "../../static/gracontent.json",
                    data:{
                        cid:50
                    }
                    success: (res) => {
                        console.log(res);
                        this.graCon = res.data.content
                    }
                })
            }

下面是我在.json写的文件,只写了一年级上册

{
    "content": [{
        "id": "250",
        "grade": "第一课",
        "title": "天地人",
        "len": "6",
        "char1": "天",
        "char2": "地",
        "char3": "人",
        "char4": "你"
    }, {
        "id": "251",
        "grade": "第二课",
        "title": "金木水火土",
        "len": "7",
        "char1": "四",
        "char2": "五",
        "char3": "下",
        "char4": "一"
    }, {
        "id": "252",
        "grade": "第三课",
        "title": "口耳目",
        "len": "7",
        "char1": "足",
        "char2": "站",
        "char3": "坐",
        "char4": "口"
    }, {
        "id": "253",
        "grade": "第四课",
        "title": "日月水火",
        "len": "8",
        "char1": "月",
        "char2": "水",
        "char3": "山",
        "char4": "石"
    }, {
        "id": "254",
        "grade": "第五课",
        "title": "对韵歌",
        "len": "8",
        "char1": "对",
        "char2": "雨",
        "char3": "风",
        "char4": "花"
    }, {
        "id": "255",
        "grade": "第六课",
        "title": "语文园地一",
        "len": "5",
        "char1": "六",
        "char2": "七",
        "char3": "九",
        "char4": "八"
    }]
}

给导航栏点击事件加参数 传参到方法里,然后发起请求

该回答通过自己思路及引用到GPTᴼᴾᴱᴺᴬᴵ搜索,得到内容具体如下:
您可以通过将导航条的id和年级的id对应起来,然后将导航条的id作为参数传递给后端,后端返回对应年级的数据。

首先,在导航条中设置每个导航项的id与对应的年级id相关联。例如:

<view @click="getGraCon(250)">第一年级上册</view>
<view @click="getGraCon(251)">第一年级下册</view>
<view @click="getGraCon(252)">第二年级上册</view>
<!-- 其他年级对应的导航项 -->

然后,在 getGraCon 方法中将导航条的id作为参数传递给后端:

getGraCon(cid) {
  uni.request({
    url: "../../static/gracontent.json",
    data: {
      cid: cid
    },
    success: (res) => {
      console.log(res);
      this.graCon = res.data.content;
    }
  });
},

在后端,您可以使用Python或其他语言解析JSON文件并查找与导航条id对应的年级id。然后,将与年级id对应的数据返回给前端。在这个例子中,您可以编写一个函数来查找与cid参数匹配的年级id,并返回对应的数据。例如,在Python中,可以使用以下代码:

import json

def get_gra_content(cid):
  with open('static/gracontent.json') as f:
    data = json.load(f)
    for item in data['content']:
      if item['id'] == str(cid):
        return item

这个函数会返回与cid参数匹配的年级数据。然后,您可以将返回的数据显示在前端。


如果以上回答对您有所帮助,点击一下采纳该答案~谢谢

您可以在导航栏点击事件的回调函数中获取当前点击的导航条年级的 id,然后把这个 id 作为参数传递给 uni.request 中的 data,请求获取对应年级的数据。

具体实现可以参考以下代码:

1.在导航栏点击事件的回调函数中获取当前点击的导航条年级的 id,然后将 id 赋值给变量 gradeId:

// 获取当前点击导航条的年级 id
onGradeNavClick(gradeId) {
    this.gradeId = gradeId;
}

2.在获取数据的方法中,使用 uni.request 发送请求,将 gradeId 作为 data 中的参数传递给后端获取对应年级的数据:

getData() {
    uni.request({
        url: 'xxx',
        method: 'POST',
        data: {
            gradeId: this.gradeId // 将导航条年级的 id 作为参数传递给后端获取对应年级的数据
        },
        success: (res) => {
            if (res.statusCode === 200) {
                // 获取数据成功,进行处理
            } else {
                // 获取数据失败,进行处理
            }
        },
        fail: (err) => {
            console.log(err);
        }
    })
}

在以上代码中,通过获取导航条年级的 id,将其赋值给 gradeId 变量,并将其作为参数传递给 uni.request 中的 data,请求获取对应年级的数据。通过这种方式可以根据不同年级的 id 请求到对应的数据。