reactjs 如何在jupyter实验室扩展中添加工具提示/悬停框

ntjbwcob  于 2023-01-05  发布在  React
关注(0)|答案(1)|浏览(185)

HoverExample
如何在jupyterlab中添加像上图这样的悬停文本到一个自定义扩展中。我正在jupyter lab中使用react做一个扩展,但是我想在悬停框中添加一个扩展的描述。但是我想不出来。

dgjrabp2

dgjrabp21#

要在扩展中添加悬停框,您必须将值传递给[widgetInstance].title.caption例如:

const extension: JupyterFrontEndPlugin<void> = {
  id: 'some-id',
  autoStart: true || false,
  activate: async(app: JupyterFrontEnd, palette: ICommandPalette) => {
     const { commands } = app;
      let widget1: widget= new widget(); // create the widget
      widget1.id = 'widget1-id';
      widget1.title.label = 'widget Label';
      widget1.title.caption="widget hovering text description"; // this will show the text when you hover over an extension
      app.shell.add(widget1, 'right', { rank: 1 });
      ...
      ...
      ... rest of your code ...

}

相关问题