我目前正在写一个基于类星体的电子应用程序。在我的typescript代码中，我有以下接口：

interface CharterParty {
  startDate: Date;
  endDate: Date;
  cargoType: string;
}

interface PortOperations {
  expectedArrival: Date;
  actualArrival: Date;
  expectedDeparture: Date;
  actualDeparture: Date;
}

interface Ship {
  name: string;
  status: string;
  charterParty: CharterParty;
  loadPortOperations: PortOperations;
  dischargePortOperations: PortOperations;
}

我想显示保存在发货列表中的数据：

const ships = ref<Ship[]>([
])

在Q表组件中。为此，我定义了以下列来测试它：

const columns = ref([
  {
    name: 'name',
    required: true,
    label: 'Name',
    field: 'name',
    sortable: true
  },
  {
    name: 'status',
    label: 'Status',
    field: 'status',
    sortable: true
  },
  {
    name: 'cargoType',
    label: 'Cargo Type',
    field: 'charterParty.cargoType',
    sortable: true
  },
  {
    name: 'startDate',
    label: 'Start Date',
    field: 'charterParty.startDate',
    sortable: true
  },
  {
    name: 'endDate',
    label: 'End Date',
    field: 'charterParty.endDate',
    sortable: true
  },
  {
    name: 'expectedArrival',
    label: 'Expected Arrival',
    field: 'loadPortOperations.expectedArrival',
    sortable: true
  },
  {
    name: 'actualArrival',
    label: 'Actual Arrival',
    field: 'loadPortOperations.actualArrival',
    sortable: true
  },
  {
    name: 'expectedDeparture',
    label: 'Expected Departure',
    field: 'dischargePortOperations.expectedDeparture',
    sortable: true
  },
  {
    name: 'actualDeparture',
    label: 'Actual Departure',
    field: 'dischargePortOperations.actualDeparture',
    sortable: true
  }
])

q表看起来像这样：

<div class="q-pa-md">
                <q-table :rows="ships" :columns="columns" row-key="name" flat bordered />
              </div>

现在我的问题是，我没有得到子对象CharterParty、DischargePortOperations和LoadPortOperations中列的显示数据。只有状态和名称中的数据才能正确显示。
我错过了什么？