uniapp 处理get数据封装
时间: 2023-08-12 16:51:00 浏览: 38
在uniapp中,我们可以使用uni.request方法来发送HTTP请求来获取数据。通常我们会将这些请求封装在一个方法中,以便在需要时调用它们。以下是一个简单的例子:
```html
<template>
<div>
<div v-for="item in items" :key="item.id">{{ item.title }}</div>
</div>
</template>
<script>
export default {
data() {
return {
items: []
}
},
mounted() {
this.getItems()
},
methods: {
getItems() {
uni.request({
url: 'http://example.com/items',
success: (res) => {
this.items = res.data
}
})
}
}
}
</script>
```
在上面的例子中,我们使用了uni.request方法来发送HTTP请求来获取数据,并将数据存储在组件的items数据属性中。我们在组件的mounted生命周期钩子中调用了getItems方法来获取数据。
如果我们需要将一些参数传递给HTTP请求,我们可以将它们作为一个对象传递给uni.request方法的data选项,例如:
```html
<template>
<div>
<div v-for="item in items" :key="item.id">{{ item.title }}</div>
</div>
</template>
<script>
export default {
data() {
return {
items: [],
filter: {
keyword: 'example'
}
}
},
mounted() {
this.getItems()
},
methods: {
getItems() {
uni.request({
url: 'http://example.com/items',
data: this.filter,
success: (res) => {
this.items = res.data
}
})
}
}
}
</script>
```
在上面的例子中,我们将一个包含关键字的筛选器对象传递给HTTP请求,以便获取包含该关键字的items。我们可以在getItems方法中的uni.request方法的data选项中传递筛选器对象。
总之,封装HTTP请求是uniapp开发中的重要概念,可以帮助我们更好地组织和管理数据。