Nodered using dashboard2:
Please, who can show me a really simple example of drawing a simple v-table by using msg.payload as data input?
I tried this with the "desserts"-array as payload the whole day but nothing renders...
https://vuetifyjs.com/en/components/tables/#usage
[
{
"id": "46663f7e9e9231e5",
"type": "inject",
"z": "10808ffc4d809688",
"name": "",
"props": [
{
"p": "payload"
}
],
"repeat": "",
"crontab": "",
"once": false,
"onceDelay": 0.1,
"topic": "",
"payload": "[{\"name\":\"Frozen Yogurt\",\"calories\":159},{\"name\":\"Ice cream sandwich\",\"calories\":237},{\"name\":\"Eclair\",\"calories\":262},{\"name\":\"Cupcake\",\"calories\":305},{\"name\":\"Gingerbread\",\"calories\":356},{\"name\":\"Jelly bean\",\"calories\":375},{\"name\":\"Lollipop\",\"calories\":392},{\"name\":\"Honeycomb\",\"calories\":408},{\"name\":\"Donut\",\"calories\":452},{\"name\":\"KitKat\",\"calories\":518}]",
"payloadType": "json",
"x": 1610,
"y": 500,
"wires": [
[
"ce149b05494dc865",
"67159871e3646fb5"
]
]
},
{
"id": "67159871e3646fb5",
"type": "ui-template",
"z": "10808ffc4d809688",
"group": "072f099c3e031939",
"page": "",
"ui": "",
"name": "",
"order": 0,
"width": 0,
"height": 0,
"head": "",
"format": "<template>\n <v-table theme=\"dark\">\n <thead>\n <tr>\n <th class=\"text-left\">\n Name\n </th>\n <th class=\"text-left\">\n Calories\n </th>\n </tr>\n </thead>\n <tbody>\n <tr v-for=\"item in msg.payload\" :key=\"item.name\">\n <td>{{ item.name }}</td>\n <td>{{ item.calories }}</td>\n </tr>\n </tbody>\n </v-table>\n</template>\n\n<script>\n</script>",
"storeOutMessages": true,
"passthru": false,
"resendOnRefresh": true,
"templateScope": "local",
"className": "",
"x": 1800,
"y": 400,
"wires": [
[]
]
},
{
"id": "072f099c3e031939",
"type": "ui-group",
"name": "Ergebnis",
"page": "b891121fc5180bae",
"width": "4",
"height": 1,
"order": 3,
"showTitle": true,
"className": "",
"visible": "true",
"disabled": "false",
"groupType": "default"
},
{
"id": "b891121fc5180bae",
"type": "ui-page",
"name": "Kennlinie",
"ui": "227638075b6e8ee2",
"path": "/page1",
"icon": "home",
"layout": "grid",
"theme": "b6fa5134e8946362",
"breakpoints": [
{
"name": "Default",
"px": "0",
"cols": "3"
},
{
"name": "Tablet",
"px": "576",
"cols": "6"
},
{
"name": "Small Desktop",
"px": "768",
"cols": "9"
},
{
"name": "Desktop",
"px": "1024",
"cols": "12"
}
],
"order": 1,
"className": "",
"visible": "true",
"disabled": "false"
},
{
"id": "227638075b6e8ee2",
"type": "ui-base",
"name": "My Dashboard",
"path": "/dashboard",
"appIcon": "",
"includeClientData": true,
"acceptsClientConfig": [
"ui-notification",
"ui-control"
],
"showPathInSidebar": false,
"headerContent": "page",
"navigationStyle": "default",
"titleBarStyle": "default",
"showReconnectNotification": true,
"notificationDisplayTime": 1,
"showDisconnectNotification": true,
"allowInstall": false
},
{
"id": "b6fa5134e8946362",
"type": "ui-theme",
"name": "Default Theme",
"colors": {
"surface": "#ffffff",
"primary": "#0094CE",
"bgPage": "#eeeeee",
"groupBg": "#ffffff",
"groupOutline": "#cccccc"
},
"sizes": {
"density": "default",
"pagePadding": "12px",
"groupGap": "12px",
"groupBorderRadius": "4px",
"widgetGap": "12px"
}
},
{
"id": "886e2ec277e4aad5",
"type": "global-config",
"env": [],
"modules": {
"@flowfuse/node-red-dashboard": "1.31.0"
}
}
]