widget

class trame_client.widgets.core.AbstractElement(_elem_name, children=None, raw_attrs=None, ctx_name=None, connect_parent=True, **kwargs)

A Vue component which can integrate with the rest of trame

See Vue docs here for more info

Parameters:

  • name (str) – The name of the element, like ‘div’ for a <div/> element

  • children (str | list[trame.html.*] | trame.html.* | None) – The children nested within this element

  • __properties – Provide more attribute names that should be handle

  • __events – Provide more event names that should be handle

Html attributes - See here for more info

Parameters:

  • id – See here for more info

  • classes – Match the HTML class attribute. See here for more info

  • style – See here for more info

Vue attributes - See here for more info

Parameters:

  • ref – See here for more info

  • v_model – See here for more info

  • v_if – See here for more info

  • v_show – See here for more info

  • v_for – See here for more info

  • key – See here for more info

Events - See here for more info

Parameters:

  • click – See here for more info

  • mousedown – See here for more info

  • mouseup – See here for more info

  • mouseenter – See here for more info

  • mouseleave – See here for more info

  • contextmenu – See here for more info

Raw attributes

Parameters:

raw_attrs – List of string that will be added as-is in the generated template

>>> print(html.Template(raw_attrs=["v-slot:item.1", 'class="bg-red"', '@click.stop="a=2"']))
... <Template v-slot:item.1 class="bg-red" @click.stop="a=2" />

Context Name:

Parameters:

ctx_name – name to attach instance to server.context if provided

DOM hierarchy handling:

Parameters:

connect_parent – True by default which means any widget instantiation will connect to the context manager widget that the current instance directly belong to. In some specific case, it could be useful to disable that behavior by setting it to False.

set_server(v)

Update the associated server

ttsSensitive()

Calling this function on an element will make it fully recreate itself every time the layout update. Internally it is managed by adding a key= attribute which use a layout timestamp.

This is especially useful for component that manage other elements outside of themself like VSelect in Vuetify.

attrs(*names)

Calling this function will process the provided attribute names and configure its internal so the matching HTML string could easily be generated later on.

Parameters:

names (*str) – The names attribute to process

events(*names)

Calling this function will process the provided event names and configure its internal so the matching HTML string could easily be generated later on.

Parameters:

names (*str) – The names events to process

clear()

Remove all children

hide()

Hide element while keeping it in the DOM. (display: none)

add_child(child)

Add a component to this component’s children

Parameters:

child (str | AbstractElement) – The component to add as a child

add_children(children)

Add components to this component’s children. The provided children is expected to be a list.

Parameters:

children (list) – The list of components to add to the children

property children

Children components

set_text(value)

Replace children with a single text child element

Parameters:

value (str) – The text for the new text child element

property html

Return a string representation of the HTML component