【四】鸡汤来咯开发学习笔记-71

1.在index.vue
在最后的project获取表中的有用值，其中的userinfo使用$.arrayElemAt获取其中数组值使其变为数组，且命名为userinfo

const getSoup=()=>{
  db.collection("soup-chicken").aggregate()
  .match(`status==1 && is_delete!=true`)
  .lookup({
      from:"uni-id-users",
      let:{
          uid:'$user_id'
      },
      pipeline:$.pipeline().match(dbCmd.expr($.eq(['$_id','$$uid']))).project({username:1,avatar:1}).done(),
      as:'userInfo'
  })
  .sample({
      size:5
  })
  .limit(5)
  .project({
      collect_count:1,
      comment_count:1,
      content:1,
      form:1,
      like_count:1,
      soup_type:1,
      view_count:1,
      userInfo:$.arrayElemAt(['$userInfo',0])
  })
  .end().then(res=>{
      console.log(res)
  })
}

2.然后解构获取data，赋值到listdata

    let {result:{errCode,data}}= await db.collection("soup-chicken").aggregate()

   if(errCode!=0) return showToast("信息有误，重新刷新","none");
      
    listData.value=data;

3.然后listdata传值到组件soup-text-content，在组件里面接收后渲染

<template>
    <text class="soup-content" :style="{'-webkit-line-clamp':maxline}">
        {{item.content}}
    </text>
    <view class="author">
        <view class="line"></view>
        <view class="outer">
            <view class="userinfo">
                <view class="avatar">
                    <image :src="item.userInfo.avatar||'../../static/images/defAvatar.png'" mode="aspectFill"></image>
                </view>
                <view class="name">{{item.userInfo.username}}</view>
                <view class="from" v-if="item.from">摘自：{{item.from}}</view>
            </view>

            <view class="number" v-if="lookState">共{{item.view_count}}人看过</view>
        </view>
    </view>
</template>

<script setup>
    defineProps({
        maxline: {
            type: [String, Number],
            default: "none"
        },
        lookState:{
            type:Boolean,
            default:false
        },
        item:{
            type:Object,
            default(){
                return{}
            }
        }
    })
</script>