【14.2】关于注册组件的使用问题RegisterComponent？

收藏

本帖最后由 excelxnz 于 2022-1-4 19:51 编辑

需求：想在自定义的组件中获取传入的参数？

当前问题场景：

我自定义了一个“科目组件”，放在工具栏中，点击弹出了一个弹窗，选中科目后，需要在“科目组件”上显示。
但不知道怎么给组件中传参，多种方式尝试无果，还请大佬指点一下。感谢

代码如下（Vue代码）：

// 1. 定义了一个 KeMuTemplate.js, 内容如下
function KeMuTemplate() {
GC.Spread.Sheets.Designer.AtomicComponentBase.call(this, ...arguments)
};
// 继承AtomicComponentBase
KeMuTemplate.prototype = new GC.Spread.Sheets.Designer.AtomicComponentBase();
KeMuTemplate.prototype.getTemplate = function (options) {
console.log(options)
// * 想得到传入的参数，完成选择后显示选中项？？？？？？
return `<button type="button" title="选择科目" class="ribbon-button-comboBox ribbon-button-item" data-text="选择科目" data-command="ribbon.cmdKeMu" dataid="1641294062437" data-buttontype="comboBox"><div class="ribbon-button-item-text">8888</div><div class="ribbon-button-item-icon ribbon-button-indicator-icon"></div></button>`;
}
KeMuTemplate.prototype.onMounted = function (host, options) {
console.log("KeMuTemplate 挂载", host, options)
}
KeMuTemplate.prototype.onValueChanged = function (prevValue, nextValue, host, options) {
// 在这里拿到选中的单元格的value，刷新组件UI显示值
}
KeMuTemplate.prototype.updateValue = function (host, options) {
return null;
}
KeMuTemplate.prototype.onDestroy = function (host) {
}
export { KeMuTemplate };
// 2. 引入app.vue 并注册了一个“科目”组件
GC.Spread.Sheets.Designer.Designer.RegisterComponent("KeMuTemplate", KeMuTemplate);
// 3.在command中使用
cmdKeMu: {
title: "选择科目",
text: "选择科目",
class: "ribbon-dbs-kemu",
commandName: "cmdKeMu",
type:'KeMuTemplate',
nnn:'想传入一个参数，初始化选中项',
execute: (context, selectValue) => {
// 单击执行正常, 打开了弹窗
},
},
// 4.弹出窗中选择后
vue:{
data:{
kemuChoose: null
},
methods:{
...
onChoose:(val){
this.kemuChoose = val;
// 但是如何将 val 赋值到 “KeMuTemplate” 中？遇到了问题
}
...
}
}