DetailView

Overview

Renders a full detail page for a single model instance, including a page title, a sticky action bar with available object actions and workflow transitions, and a FormModel that displays or edits the object's fields. Fetches the object from the API automatically using the provided app, model, and pk props.

Theme entry: DetailView

Props

Name	Type	Required	Default	Description
themeOverride	String|Object|Array		null	A partial theme object merged with the component's default theme; accepts a class string, class array, or theme object.
app	string	yes		Django app label that owns the model.
model	string	yes		Django model name identifying which object type to fetch and display.
viewName	string	yes		View identifier used to load the model config and construct the form ID.
pk	string	yes		Primary key of the object instance to fetch and render.
objectForm	object		undefined	Form state object returned by useObjectForm, used to track submission state and trigger submit.
variant	string		"default"	Theme variant applied to the root element.
formModelVariant	string		"default"	Theme variant forwarded to the inner FormModel component.
class	string|array|object		() => []	CSS class(es) applied to the outermost root element.
fields	array		undefined	Field names to render in the form; overrides the model config default.
fieldDetails	object		undefined	Map of field paths to field detail overrides.
expand	array		undefined	Field names to render in expanded (inline) mode.
expandDetails	object		undefined	Map of expand field paths to detail overrides.
fieldComponents	object		undefined	Map of field paths to async functions returning an override field component.
widgetComponents	object		undefined	Map of field paths to async functions returning an override widget component.
formProps	object		undefined	Extra props merged into the FormModel component.
fieldProps	object		undefined	Map of field paths to additional props passed to the field component.
widgetProps	object		undefined	Map of field paths to additional props passed to the widget component.
relatedObjectRules	object		{}	Rules mapping related object keys to fetch data alongside the main object.
calculatedObjectRules	object		{}	Rules mapping calculated object keys to derive computed data alongside the main object.
fetchFields	array		undefined	Field names to request from the API when fetching the object; overrides the model config default.
submitFields	array		undefined	Field names to include when submitting the form; overrides the model config default.
primaryActions	array		undefined	Action names promoted to the filled hero CTA in the action bar; defaults to the update action.

Slots

Name	Scoped	Description
targetless-action-button	yes
extra-buttons		Additional action buttons appended in the page title action area.
submit-button	yes	Override the submit button shown in the sticky action bar for update views.
action-button	yes	Override an individual action link button in the sticky bar.
transition-button	yes	Override an individual workflow transition button in the sticky bar.

Full slot reference

Events

Name	Description
object
loading
related-object
calculated-object
form-object
form-context

Full event reference

Source

client/lib/views/DetailView.vue