山海鲸可视化

类之间的通信

注意,山海鲸 4.0 之后弃用了 3.0 中的 FindExtensionsOfClass 方法,现在如果需要获取其他类的实例,需要用到 getExtensionInstances 或者 getExtensionInstance,具体 API 文档可以参考:Element 类 - 开发教程 - 山海鲸可视化
下面就一个具体的实例来看下两个二开类之间的通信方法:
我们有两个按钮,分别挂载了一个 NumberText 的二开和 Random 的二开,我们需要在 NumberText 类中获取 Random 类的实例,代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
class NumberText {
randomElement = Element.empty();
getInstanceFromElement(element) {
//如果对象元素上只挂载了一个二开类,则直接调用getExtensionInstance
//如果挂载了多个二开类 则调用getExtensionInstances后再进行筛选
const randomInstances = element.getExtensionInstance();
return randomInstances[0];
}
updateText() {
const random = this.randomElement.getExtensionInstance();
if (random) {
this.element.setOption(["text"], random.getRandomNumber());
}
}
init() {
this.updateText();
}
//设置改变时也更新
onPropertyChanged(name) {
if (name == "randomElement") {
this.updateText();
}
}
}
export default NumberText;
1
2
3
4
5
export class Random {
getRandomNumber() {
return Math.random();
}
}

NumberText 挂载到文本组件上,而 Random 挂载到随机按钮上,然后设置文本这边的二开生成的元素设置项改为随机按钮:
image.png
设置好了之后,就可以看到文本这边的 NumberText 类已经获取到了随机按钮上挂载的 Random 类的实例了:
image.png
当然有的时候,也有可能有很多的元素上都挂载了同一个二开类,需要同时获取这些类的实例,则可以配合 getChildren 和 getParent 方法来获取这些实例。