类星体框架自动完成，没有在列表中显示文本

Question

我正在使用类星体的最新版本(0.17)，并尝试使用自动完成组件。我能够过滤列表并选择一个值，但是自动完成列表中的文本没有显示：

​

​

以下是定义：

<q-field :error="$v.clientInfo.name.$error" error-label="Client name is required">
  <q-input placeholder="Start typing a client's name" float-label="Client Name" type="text" v-model="clientInfo.name" @blur="$v.clientInfo.name.$touch" :before="getIcon('perm_identity')" clearable>

      <q-autocomplete :min-characters="0" :value-field="v => `${ v.name }  (${ v.phone })`" :static-data="{field: 'name', list: clients}" :filter="myFilter" />

  </q-input>
</q-field>

客户端数组：

clients: [{
        name: 'client 1',
        phone: '0545684562'
      }, {
        name: 'client 2',
        phone: '0556843544'
      }]

Answer 1

因此，显然列表中的每个对象都必须包含值/标签，因此我将数据更改为如下所示：

clients: [{
    label: 'client 1',
    value: 'client 1',
    phone: '0545684562'
  }, {
    label: 'client 2',
    value: 'client 2',
    phone: '0556843544'
  }]

以及模板：

<q-field :error="$v.clientInfo.name.$error" error-label="Client name is required">
  <q-input placeholder="Start typing a client's name" float-label="Client Name" type="text" v-model="clientInfo.name" @blur="$v.clientInfo.name.$touch" :before="getIcon('perm_identity')" clearable>

      <q-autocomplete :min-characters="0" :value-field="v => `${ v.value}  (${ v.phone })`" :static-data="{field: 'value', list: clients}" :filter="myFilter" />

  </q-input>
</q-field>

而且起作用了！