nativescript-vue 中的 RadDataForm 多选

Posted 2023-04-13

【中文标题】nativescript-vue 中的 RadDataForm 多选

【英文标题】：RadDataForm Multiple select in nativescript-vue

【发布时间】：2019-10-22 03:23:26

【问题描述】：

我有这个 TKEntityProperty：

    <TKEntityProperty v-tkDataFormProperty name="groups" displayName="Groups" index="2" :valuesProvider="retrieveGroups">

这会从下面的对象中获取值：

retrieveGroups:[
   key: "1", "label": "Group 1",
   key: "2", "label": "Group 2",
   key: "3", "label": "Group 3" 
]

但它不会多选。我想选择多个元素。 是否有其他类型的编辑器可用？

【问题讨论】：

“列表”编辑器不支持选择多个项目。使用 AutoCompleteInline 否则您将不得不引入自己的自定义编辑器。

AutoCompleteInline 示例？

你只需要参考docs

【参考方案1】：

正如@Manoj 建议的那样，您应该使用AutoCompleteInline 这是一个例子，它可以在 Nativescript github page 获得

data() 
  return 
    title: description,
    booking: new Booking(),
    bookingMetadata: 
      'isReadOnly': false,
      'commitMode': DataFormCommitMode.Immediate,
      'validationMode': DataFormValidationMode.Immediate,
      'propertyAnnotations': [
          'name': 'from',
          'displayName': 'From:',
          'index': 0,
          'editor': DataFormEditorType.AutoCompleteInline,
          'editorParams': 
            'autoCompleteDisplayMode': AutoCompleteDisplayMode.Tokens
          ,
          'valuesProvider': fromProviders,
        ,
        
          'name': 'to',
          'displayName': 'To:',
          'index': 1,
          'editor': DataFormEditorType.AutoCompleteInline,
          'editorParams': 
            'autoCompleteDisplayMode': AutoCompleteDisplayMode.Plain
          ,
          'valuesProvider': ['New York', 'Washington', 'Los Angeles'],
        ,
      ]
    
  ;
,

【讨论】：

确定，但是当在列表中选择一个项目时，这不会从列表中消失。我只想为项目选择一次。并且注意到没有在editedObejct中返回数据数组