作为一个前端程序,使用uniapp框架,我需要在view控件的点击事件,加一个跳转到一个详情页上,并传输inquiry_id参数,请用代码实现,请输出接受页面的如何接受参数,用log输出
时间: 2024-01-01 11:04:21 浏览: 20
好的,以下是示例代码:
详情页代码(detail.vue):
```html
<template>
<view>
<text>接收到的 inquiry_id 参数为:{{ inquiryId }}</text>
</view>
</template>
<script>
export default {
data() {
return {
inquiryId: '',
};
},
onLoad(options) {
this.inquiryId = options.inquiry_id;
console.log('接收到的 inquiry_id 参数为:', this.inquiryId);
},
};
</script>
```
在上面的代码中,我们通过 `onLoad` 生命周期钩子函数来接收传递过来的参数,并将其存储在 `inquiryId` 数据属性中。同时,我们通过 `console.log` 方法在控制台输出了接收到的参数。
如果你要使用这个详情页,可以通过以下代码跳转:
```html
<template>
<view @tap="gotoDetail">{{ inquiry.title }}</view>
</template>
<script>
export default {
data() {
return {
inquiry: {
id: 123,
title: '这是一条询价信息',
},
};
},
methods: {
gotoDetail() {
uni.navigateTo({
url: `/pages/detail/detail?inquiry_id=${this.inquiry.id}`,
});
},
},
};
</script>
```
在这个示例中,我们通过 `uni.navigateTo` 方法跳转到详情页,并在 URL 中传递了 `inquiry_id` 参数。当用户点击页面上的控件时,就会触发 `gotoDetail` 方法,从而跳转到详情页。