1：index.vue的页面,在按钮上绑定点击事件，将所要传递的参数放在点击事件的方法里面。
代码语言：javascript复制<text @click="details(item.id)"></text>2：进入methods，将参数放在方法里面，并且在url跳转路径后面进行拼接。
代码语言：javascript复制details(id) {
uni.navigateTo({
url: "details?id=" id,
});
},3：在pages里面新建一个details.vue页面，接收index.vue传过来的参数。
4：在onLoad里面打印一下接受到的参数
代码语言：javascript复制onLoad(option) {
console.log(option.id)
},
5：index.vue页面的参考代码
代码语言：javascript复制<template>
<view>
<view class="padding-xl" v-for="(item,index) in fenecList.fences" :key="index">
<text @click="details(item.id)">{{item.id}} {{item.name}}</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
fenecList: [],
};
},
onLoad() {
this.getList();
},
methods: {
getList() {
uni.request({
url: "../../static/test.json",
method: 'get',
dataType: 'json',
success: (res) => {
console.log(res.data);
this.fenecList = res.data.info;
},
});
},
details(id) {
uni.navigateTo({
url: "details?id=" id,
});
},
},
}
</script>
<style>
</style>details.vue参考的代码
代码语言：javascript复制<template>
<view>
</view>
</template>
<script>
export default {
data() {
return {
};
},
onLoad(option) {
console.log(option.id)
this.getList(option.id);
},
methods: {
getList(id) {
uni.request({
url: "xxx",
method: 'get',
dataType: 'json',
data: {
"id":"id",
},
success: (res) => {
},
});
},
},
}
</script>
<style>
</style>test.json
代码语言：javascript复制{
"retCode": 1,
"info": {
"configName": "家庭作业",
"fences": [{
"id": 1,
"name": "测试区域一"
},{
"id": 2,
"name": "测试区域二"
},{
"id": 3,
"name": "测试区域三"
},{
"id": 4,
"name": "测试区域四"
}]
}
}
