unicloud云开发进阶15-各类过滤条件和云端环境变量$cloudEnv_uid

加载中 loading

<template>
  <view>
    <unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo">
      <view class="">{{loading}}</view>
      <view v-if="error">{{error.message}}</view>
      <view v-else>
        
        <uni-list>
          <uni-list-item v-for="item in data" :title="item.title" :note="item.content"></uni-list-item>
        </uni-list>
      
      </view>
    </unicloud-db>
  </view>
</template>

loading属性：页面在加载中返回true，加载完成返回false

使用uni-ui的加载中组件展示加载效果

<template>
  <view>
    <unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo">
       
      <view v-if="error">{{error.message}}</view>
      <view v-else-if="loading">
        <uni-load-more status="loading"></uni-load-more>
      </view>
      <view v-else>
        <uni-list>
          <uni-list-item v-for="item in data" :title="item.title" :note="item.content"></uni-list-item>
        </uni-list>
      
      </view>
    </unicloud-db>
  </view>
</template>

使用官方自带的uni-ui组件<uni-load-more status="loading">展示刷新效果

筛选 指定查询字段 field

    <unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo" field="title">

指定只获取title

给字段起别名,使用时用别名

<unicloud-db v-slot:default="{data, loading, error, options}" 
collection="cloudDemo" field="title as t">

orderBy排序

<unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo" orderby="_id desc">

可以先根据时间倒序排序，如果时间重复，根据id进行倒序排序

<unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo" orderby="posttime desc,_id desc">

where 查询

通过时间戳查询

<unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo" orderby="posttime desc" where="posttime > 1677738540128">

where也可以写到data中 id是字符串格式，定义时要写到引号中

<template>
  <view>
    <unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo" orderby="posttime desc" :where=mywhere>
       
      <view v-if="error">{{error.message}}</view>
      <view v-else-if="loading">
        <uni-load-more status="loading"></uni-load-more>
      </view>
      <view v-else>
        <uni-list>
          <uni-list-item v-for="item in data" :title="item.title" :note="item.content"></uni-list-item>
        </uni-list>
      
      </view>
    </unicloud-db>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        mywhere:"_id == 'a62c32976400422c0009275d6fdf68d9'"
      };
    }
  }
</script>

匹配当前用户

获取当前用户文档：在JQL语法中提供的JQL语句内云端环境变量 $cloudEnv_uid,这个变量依赖uni-id

<template>
  <view>
    <unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo" orderby="posttime desc" :where=mywhere>
       
      <view v-if="error">{{error.message}}</view>
      <view v-else-if="loading">
        <uni-load-more status="loading"></uni-load-more>
      </view>
      <view v-else>
        <uni-list>
          <uni-list-item v-for="item in data" :title="item.title" :note="item.content"></uni-list-item>
        </uni-list>
      
      </view>
    </unicloud-db>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        mywhere:"userid == $cloudEnv_uid"
      };
    }
  }
</script>

<style lang="scss">

</style>

重新登陆后

联表查询 collection

主表写在前，副表写在后 大括号前面四个字段都是主表字段，主表通过foreign-key字段userid关联副表，大括号里写的就是副表要查询的字段

field="title,content,posttime,userid{username,avatar_file}"

<template>
  <view>
    <unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo,uni-id-users" 
    orderby="posttime desc"
    field="title,content,posttime,userid{username,avatar_file}"
    >
       
      <view v-if="error">{{error.message}}</view>
      <view v-else-if="loading">
        <uni-load-more status="loading"></uni-load-more>
      </view>
      <view v-else>
        <uni-list>
          <uni-list-item v-for="item in data" :title="item.title" :note="item.content"></uni-list-item>
        </uni-list>
      
      </view>
    </unicloud-db>
  </view>
</template>

将数据放到uni-list组件中渲染（头像还是出不来，不知道原因,控制台报跨域问题）

<template>
  <view>
    <unicloud-db v-slot:default="{data, loading, error, options}" collection="cloudDemo,uni-id-users" 
    orderby="posttime desc"
    field="title,content,posttime,userid{username,avatar_file}"
    >
       
      <view v-if="error">{{error.message}}</view>
      <view v-else-if="loading">
        <uni-load-more status="loading"></uni-load-more>
      </view>
      <view v-else>
        <uni-list>
          <uni-list-item v-for="item in data" 
          :title="item.title" 
          :note="item.content"
          :thumb="item.userid[0].avatar_file.url"
          :right-text="item.userid[0].username"
          ></uni-list-item>
        </uni-list>
      
      </view>
    </unicloud-db>
  </view>
</template>