Vue道具显示为未定义

Question

这是我的父组件。

<FolderList
          :showData="false"
          :propClientObj="{clientno: clientno, clientname:`${clientObj.fname} ${clientObj.lname} ${clientObj.cname}`}"
        />

这是子组件
1）FolderList

<FolderCreateM
              :folderno="folder.folderno"
              :propClientObj="propClientObj"
              @foldersave="getFolder"
            />

和
2）FolderCreateM

<template>
<v-row>
<v-col md="8" class="py-0">
            <v-autocomplete
              v-model="clientno"
              :items="clientListArr"
              label="Select Client"
              item-text="clientname"
              item-value="clientno"
              dense
            ></v-autocomplete>
          </v-col>
          <v-col md="4" class="py-0">
            <v-text-field outlined readonly dense label="Client No" v-model="clientno"></v-text-field>
          </v-col>
</v-row>
</template>

export default {
name: "FolderCreateM",
  props: {
    folderno: {
      type: String,
      default() {
        return null;
      }
    },
    propClientObj: {
      type: Object,
      default() {
        return null;
      }
    }
  },
  data() {
    return {
      clientListArr: [],
      clientno:""
    }
  }
  mounted() {
    this.clientListArr = [this.propClientObj];
    this.clientno = lo_get(this.propClientObj, "clientno", "");

    this.getClientList();
  }
}

现在在第二个组件的我的clientlistArr内部，客户端名称显示为undefined undefined undefined。但是客户端不会在文本字段中打印出来。我该如何解决以下问题。