基于小程序云开发如何实现模糊查询功能

最新推荐文章于 2024-07-17 10:06:05 发布

前端偏执狂

最新推荐文章于 2024-07-17 10:06:05 发布

阅读量1.1k

点赞数

分类专栏：小程序文章标签：小程序 javascript 数据库 html js

本文链接：https://blog.csdn.net/psjc2018/article/details/106953026

版权

本文介绍了作为小白如何利用小程序云开发的数据库来实现查询功能，避免将大量数据存于代码中导致的臃肿问题。教程推荐了微信官方的前端开发实战免费视频教程，帮助初学者学习。

摘要由CSDN通过智能技术生成

前言：作为一名小白，近几天花了很多时间去学习如何使用小程序的云开发里的数据库作为数据库，在小程序上实现查询功能。

查询功能是小程序开发中不可绕过的一大功能，因为我们不可能把所有的数据都放在代码中，那样子显得过于臃肿，虽然说我们可以利用云开发的中“储存”功能把需要用到的图片上传至存储中，然后进行引用。
效果图

/*pages/sousuo/sousuo.wxml*/
<view class="sousuo">
  <view class="search">
    <view class="search_input">
      <input class="search_input2" placeholder='请输入要查询的公交线路' placeholder-class="placeholderStyle" value='{
   {searchVal}}' bindconfirm="search" bindinput="input"></input>
      <image class="delete_icon"  wx:if="{
   { searchVal != '' }}" catchtap="clear" src="../../images/delete.png"></image>
    </view>
    <image class="search_icon" src="../../images/sousuo.png" catchtap="search"></image>
  </view>
  <scroll-view class="search_scroll" scroll-y="true">
      <view class="search_jieguo"> 
        <view class="search_items" wx:for="{
   {busList.length}}" wx:key="index">
          <view class="message">
            <view class="line">{
   {
   busList[index].line}}路({
   {
   busList[index].company}})</view>
            <view class="road">{
   {
   busList[index].road}}</view>
            <text>\n</text>
            <view class