uniAPP下的搜索栏模糊查询

首先添加导航栏代码

<uni-search-bar @input="inoutWatcher" @confirm="doSearch" placeholder="请输入想要查询的"></uni-search-bar>

@input为搜索事件会根据你输入的直接进行显示

@confirm也为搜索事件按下Enter建显示

placeholder 为标题

接下来

事件监听

图片分别为两个监听事件 

doSearch(e){
				//console.log(e.value);
				uni.request({
				    url: 'http://localhost:8070/user/list_by_phone/'+e.value,//仅为示例，并非真实接口地址。
				    success: (res) => {	 
				       //  console.log(res.data);
						 this.userList = res.data.data;
						 this.pageTotle = res.data.rows;
				    }
				});
			},
			//监听用户输入字符的变化
			inoutWatcher(e){
				uni.request({
				    url: 'http://localhost:8070/user/list_by_phone/'+e,//仅为示例，并非真实接口地址。
				    success: (res) => {	 
				       //  console.log(res.data);
						 this.userList = res.data.data;
						 this.pageTotle = res.data.rows;
				    }
				});
			}

 可以看出doSearch（e）{}  inoutWatcher（e）{}  分别为我们自己设置的变量不过尽量 见名知意

e 为参数变量 接受输出的东西

运行就可以得到我们需要的东西非常简单

数据库的模糊查询

代码讲解

<select id="selectByPhone" parameterType="String" resultMap="BaseResultMap">
    select * from auth_user where phone like '%' #{phone} '%'
  </select>

 这段代码

重点like

like是需要和%搭配使用的

在where条件之后与其他确定的条件不同

记住使用顺序就可以达到目的

结束