diff --git a/src/components/quickcommandUI/QuickCommand.vue b/src/components/quickcommandUI/QuickCommand.vue index c575c5c..b89b931 100644 --- a/src/components/quickcommandUI/QuickCommand.vue +++ b/src/components/quickcommandUI/QuickCommand.vue @@ -186,6 +186,9 @@ export default { * initItems = [{title: "1", description: "1"}, {title: "2", description: "2"}, {title: "3", description: "3"}] * options = {placeholder: "输入进行筛选,支持拼音", optionType: "json", enableSearch: true, showCancelButton: false, closeOnSelect: true} * + * 如需对每个选项单独注册点击事件,可以在initItems的元素中添加id和clickFn,如: + * initItems = [{id:1, title: "1", description: "1", clickFn:function(e){console.log(e)}}, {id:2, title: "2", description: "2", clickFn:function(e){console.log(e)}}] + * * @example * initItems = ["
1
", "
2
", "
3
"] * options = {placeholder: "输入进行筛选,支持拼音", optionType: "html", enableSearch: true, showCancelButton: false, closeOnSelect: true} diff --git a/src/components/quickcommandUI/SelectList.vue b/src/components/quickcommandUI/SelectList.vue index 4ada780..23d5e97 100644 --- a/src/components/quickcommandUI/SelectList.vue +++ b/src/components/quickcommandUI/SelectList.vue @@ -144,7 +144,7 @@ export default { id: this.currentIndex, text: this.matchedItems[this.currentIndex], }; - this.$emit("clickOK", selected); + this.is.json && selected.clickFn ? selected.clickFn(this.matchedItems[this.currentIndex].id) : this.$emit("clickOK", selected); this.options.options.closeOnSelect && this.hide(); }, diff --git a/src/plugins/monaco/types/quickcommand.api.d.ts b/src/plugins/monaco/types/quickcommand.api.d.ts index 27bfff0..5fb9062 100644 --- a/src/plugins/monaco/types/quickcommand.api.d.ts +++ b/src/plugins/monaco/types/quickcommand.api.d.ts @@ -55,8 +55,15 @@ interface quickcommandApi { * // json * var opt = [] * for (var i = 0; i < 15; i++) { - * // 每一个选项为 json 格式 - * opt.push({title: `选项${i}`, description: `选项${i}的描述`, icon: `http://www.u.tools/favicon.ico`,abcd: `选项${i}的自定义属性`}) + * // 每一个选项为 json 格式, 使用clickFn注册选项单击事件时id属性是必需的 + * opt.push({ + * id: i, + * title: `选项${i}`, + * description: `选项${i}的描述`, + * icon: `http://www.u.tools/favicon.ico`, + * abcd: `选项${i}的自定义属性`, + * clickFn:function(e){console.log(e)} + * }) * } * quickcommand.showSelectList(opt, {optionType: 'json'}).then(choise => { * console.log(`选择的选项为${choise.title}`)