Uniapp是一个基于Vue.js的开发框架，可以快速开发跨平台的应用程序。在Uniapp中，可以通过路由跳转或者函数参数的方式传递参数。
以下是两种常用的传递参数的方式：
1. 通过路由跳转传递参数
在路由跳转时，可以在路由的参数中设置参数，然后在目标页面中通过props接收参数。例如：
“`html
<!– 目标页面 –>
<template>
<view>
<text>{{ message }}</text>
</view>
</template>
<script>
export default {
props: ['message'],
}
</script>
“`
“`html
<!– 跳转页面 –>
<template>
<view>
<button @click=”navigateTo('/target?message=hello')”>跳转</button>
</view>
</template>
<script>
import TargetPage from '@/pages/TargetPage.vue'
export default {
components: { TargetPage },
methods: {
navigateTo(path) {
this.$router.push({ path, query: { message: 'hello' }})
},
},
}
</script>
“`
在上面的例子中，通过路由跳转传递了一个名为`message`的参数，并将其设置为`hello`。在目标页面中，通过props接收到了这个参数。
2. 通过函数参数传递参数
在函数调用时，可以在函数的参数中设置参数，然后在函数内部通过参数获取数据。例如：
“`html
<!– 目标页面 –>
<template>
<view>
<text>{{ message }}</text>
</view>
</template>
<script>
export default {
data() {
return {
message: ''
}
},
methods: {
async getData() {
const res = await this.$http.get('/data?message=hello') // 发送异步请求获取数据，message为参数名，hello为参数值，注意在res.data中获取响应的数据对象时，需要在数据对象名前加上res.data来获取真正的数据对象名。// 注意这里的数据需要异步获取，否则会阻塞页面渲染。// 获取到数据后，将数据赋值给message即可。// 返回res.data即可。
© 版权声明
文章版权归作者所有，未经允许请勿转载。
相关文章
暂无评论...
