widget

class trame_client.widgets.core.AbstractElement(_elem_name, children=None, raw_attrs=None, **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" />
property server

Return the associated server

set_server(v)

Update the associated server

property state

Return the associated server state

property ctrl

Return the associated server controller

property ctx

Return the associated server context

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