1

我想添加一个仅针对特定类型的元素(不是链接)打开的第三个检查器,例如仅针对 Rappid 中的 basic.Rect。

到目前为止,有 2 个 Inspectors.For 元素和链接。

有什么办法可以做到吗?

以下代码是 Rappid KitchenSkink 版本的一部分。

这是函数createInspector:

createInspector: function(cellView) {

    var cell = cellView.model || cellView;

    // No need to re-render inspector if the cellView didn't change.
    if (!this.inspector || this.inspector.options.cell !== cell) {

        // Is there an inspector that has not been removed yet.
        // Note that an inspector can be also removed when the underlying cell is removed.
        if (this.inspector && this.inspector.el.parentNode) {

            this.inspectorClosedGroups[this.inspector.options.cell.id] = _.map(app.inspector.$('.group.closed'), function(g) {
        return $(g).attr('data-name');
    });

            // Clean up the old inspector if there was one.
            this.inspector.updateCell();
            this.inspector.remove();
        }

        var inspectorDefs = InspectorDefs[cell.get('type')];

        this.inspector = new joint.ui.Inspector({
            inputs: inspectorDefs ? inspectorDefs.inputs : CommonInspectorInputs,
            groups: inspectorDefs ? inspectorDefs.groups : CommonInspectorGroups,
            cell: cell
        });

        this.initializeInspectorTooltips();

        this.inspector.render();
        $('.inspector-container').html(this.inspector.el);

        if (this.inspectorClosedGroups[cell.id]) {

    _.each(this.inspectorClosedGroups[cell.id], this.inspector.closeGroup, this.inspector);

        } else {
            this.inspector.$('.group:not(:first-child)').addClass('closed');
        }
    }
}
4

1 回答 1

1

如果您joint.ui.Inspector.create('#path', inspectorProperties)在特定 DOM 元素中使用任何先前的 Inspector 实例,则会删除并创建新实例并自动呈现到 DOM 中(它避免创建 的新实例joint.ui.Inspector()、呈现它、手动添加呈现结果并删除先前的实例) .

它还跟踪打开/关闭的组,并根据上次使用的状态恢复它们。

除此之外,inspectorProperties当您即将进入create()检查器时,您可能总是有几个先前定义的不同对象。因此,按照您粘贴的代码,您可以先执行所需的测试,然后创建适当的检查器:

if(cell instanceof joint.basic.Rect){

  var customInputs = _.clone(CommonInspectorInputs);
  // extend more inputs into `customInputs` from a variable previously defined
  // OR modify the default rectangle's inspector directly, example:
  customInputs.attrs.text = {
    type: 'textarea',
    label: 'Multiline text',
    text: 'Type\nhere!',
    group: joint.util.getByPath(CommonInspectorInputs.attrs, 'text/group', '/');
  };

  joint.ui.Inspector.create('.extra-inspector-container', {
    cell: cell
    inputs: customInputs,
    groups: CommonInspectorGroups,
  });
} // if only ONE inspector needs to be loaded add an ELSE block here
  // and use '.inspector-container' in the `create()` above

// If `InspectorDefs` is a global variable with all the cells inspectors properties
// create and load the default inspector
joint.ui.Inspector.create('.inspector-container', _.extend({cell: cell},
  InspectorDefs[cell.get('type')])
);
于 2018-03-01T12:20:54.967 回答