uniapp---如何写出一个搜索框

发布于：2022-12-26 ⋅ 阅读:(722) ⋅ 点赞:(0)

本文章主要写了如何调接口并且写出搜索框。

一、调接口

具体如何调接口，请看这个👉👉👉uniapp接口封装，这个是最详细的讲解如何调出一个接口

1.调搜索框的接口

下面我写的是如何调搜索框的接口

这个是在api/index.js里面写的

这里有参数所以下面这里也要写参数

// 首页 /api/index/search
export const getSearch = (message) => request({url: '/api/index/search',method: 'post',data: {message}})


//地址就是复制的图上面的东西    首页 /api/index/search  然后里面也要改成这个地址
//因为接口里有参数，所以这里也要写上参数message，前后都要写

2. 下面在搜索页面search里面写以下的内容

        import {getSearch} from '@/api' //这个需要放在<script>里面的最上面，也就是这个是                                        <script>里面的第一行代码


			async getSearch(){ //下面这些都是放在方法里面的
			  try {
			    const res = await getSearch(this.keyword)
				this.userInfo = res
			    console.log('getSearch', res)
			    // 保存数据
			  } catch (err) {
			 	uni.showToast({ title:err,icon:'none' })
			    console.log('getSearch', err)
			  }
			},

然后就是这样的

示例如下：