# Vuejs Composition API in Dashboard 2.0 ui template

**URL:** https://discourse.nodered.org/t/vuejs-composition-api-in-dashboard-2-0-ui-template/96818
**Category:** Dashboard
**Tags:** dashboard-2, ui-template
**Created:** [30 April 2025 08:07 UTC](https://discourse.nodered.org/t/vuejs-composition-api-in-dashboard-2-0-ui-template/96818 "2025-04-30T08:07:36Z")
**Posts on this page:** 2
**Page:** 1

<div class="post-metadata">

### Author: ![Cimanes](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cimanes/32/100492_2.png) [@Cimanes](https://discourse.nodered.org/u/Cimanes)
#### Post date: [30 April 2025 08:07 UTC](https://discourse.nodered.org/t/vuejs-composition-api-in-dashboard-2-0-ui-template/96818/1 "2025-04-30T08:07:36Z")

</div>

Hi,  
I am pretty new to NodeRed. I find it amazing, I am now getting familiar with Dashboard 2.0.  
I have a quick question about ui templates. Looking at the documentation, I find:  
_## Building Full Vue Components_  
_You can build full Vue components in the `ui-template` node, using VueJS's [Options API]. This allows you to build your own bespoke behaviour, and gives you more control over the UI._

Is it also possible to use VueJS's Composition API? Or only Options API will work?  
If Composition API can work, is there any guide on how to create and use reactive variables... (i.e., do we need to use "ref" "reactive" "computed"...).  
Any comments are welcome.  
Thanks!!  
(Note: using Node-RED version 4.0.9 // Node.js version 22.14.0)

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)
#### Post date: [30 May 2025 08:08 UTC](https://discourse.nodered.org/t/vuejs-composition-api-in-dashboard-2-0-ui-template/96818/2 "2025-05-30T08:08:33Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
