uni-app路由传参的方法有很多种,今天介绍根据click事件进行传参,上代码
html部分:
<view
class="code"
@click="getdetails(value)"
>
事件执行部分(传参)
data(){
return{
value:1
}
},
methods:{
getdetails(type){
uni.navigateTo({
url:`./details?type=${type}`
})
}
}
目标路由接收参数
onLoad(e){
this.state = e.type
},
这样就简单实现了静态传递参数,也可以试试动态传递参数
动态传递参数
盒子部分:
<view
class="carbox"
v-for="item in carList"
:key="item.type"
@click="getadd(item.type)"
>
模拟数据部分:
data() {
return {
carList: [
{
flag: "事假",
tips: "按小时请假",
type: "01",
},
{
flag: "调休",
tips: "按小时请假",
type: "02",
},
{
flag: "病假",
tips: "按小时请假",
type: "03",
},
{
flag: "年假",
tips: "按半天请假",
type: "04",
},
{
flag: "产假",
tips: "按天请假",
type: "05",
},
{
flag: "陪产假",
tips: "按天请假",
type: "06",
},
{
flag: "婚假",
tips: "按天请假",
type: "07",
},
{
flag: "例假",
tips: "按半天请假",
type: "08",
},
{
flag: "丧假",
tips: "按天请假",
type: "09",
},
{
flag: "哺乳假",
tips: "按小时请假",
type: "10",
},
],
};
},
发送参数部分:
getadd(type){
uni.navigateTo({
url:`./home?type=${type}`//目标路由
})
}
接收参数部分:
onLoad(e){
this.typeid = e.type
console.log(this.typeid)
},