[{"id":"8b4876ad871c51f5","type":"http in","z":"e97abacb4c80db24","name":"","url":"/myview","method":"get","upload":false,"swaggerDoc":"","x":250,"y":140,"wires":[["cb80d322be19fc9c"]]},{"id":"cb80d322be19fc9c","type":"template","z":"e97abacb4c80db24","name":"input form","field":"form","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<bc-section title=\"Customise my view\" id=\"home-section\" has_grid=\"false\">\n \n<form>\n<div class=\"form-group\">\n <div class=\"column--xs-12 column--md-3\" style=\"display: table;\">\n <bc-input type=\"text\" label=\"Enter the menu items\" v-model=\"form.title\" placeholder=\"\" >\n </bc-input>\n <div class=\"input-group-btn\">\n <div class=\"btn-toolbar\" v-if=\"!formiphelp\">\n <bc-button @click=\"addEntry()\" icon=\"plus\" action=\"success\" v-model=\"form.addentry\" :is_enabled=\"formiphelp=null\"></bc-button>\n </div>\n </div>\n </div>\n</div>\n\n<div class=\"table-responsive scrollbars\" v-if=\"form.items.length>0\">\n <table class=\"table table-hover\">\n <thead>\n <tr>\n <th>Entries</th>\n <th>Delete</th>\n </tr>\n </thead>\n <tbody>\n <tr v-for=\"entry in form.items\">\n <td>\n {%entry%}\n </td>\n <td>\n <bc-button @click=\"deleteEntry(entry)\" icon=\"minus\" action=\"success\"></bc-button>\n </td>\n \n </tr>\n </tbody>\n </table>\n </div>\n <div class=\"btn-link-toolbar\" v-if=\"form.items.length>0\">\n <bc-button id=\"button\" @click=\"updateMyView()\" action=\"primary\" label=\"Submit\"\n ></bc-button>\n \n </div>\n</form>\n\n</bc-section>\n\n \n\n\n","output":"str","x":420,"y":140,"wires":[["bd97c05ea70ad3ec"]],"icon":"node-red/file.svg"},{"id":"bd97c05ea70ad3ec","type":"template","z":"e97abacb4c80db24","name":"javascript - vue.js","field":"vue","fieldType":"msg","format":"javascript","syntax":"mustache","template":"\nvar app = new Vue({\n\n el: '#app',\n delimiters: ['{%', '%}'],\n data: {\n user: \"{{{req.headers.x-insight-username}}}\",\n \n form: {\n items:[],\n title:[]\n \n },\n },\n\n mounted() {\n\n },\n\n created() {\n\n },\n watch: {\n \n\n },\n filters: {\n \n \n \n },\n computed: {\n\n \n },\n\n methods: {\n addEntry(){\n this.form.items.push(this.form.title)\n console.log(\"add entry\", this.form);\n this.form.title=\"\"\n },\n deleteEntry(entry) {\n console.log(\"delete address\", entry);\n this.form.items = this.form.items.filter(e => e !== entry)\n console.log(\"remaining entries\", this.form.items);\n\n },\n updateMyView(){\n var obj = { \n payload:{\n \"menuitem\":this.form.items\n }\n \n };\n console.log(\"updateMyView\", obj);\n }\n }\n\n});","x":510,"y":200,"wires":[["0b8b22b2f12c1c4e"]],"icon":"node-red/parser-json.svg"},{"id":"0b8b22b2f12c1c4e","type":"change","z":"e97abacb4c80db24","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"vue","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":680,"y":280,"wires":[["9a77e5bed91f61fe"]]},{"id":"9a77e5bed91f61fe","type":"debug","z":"e97abacb4c80db24","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":1010,"y":280,"wires":[]}]
Is there any way i could access highlighted variables in msg.payload.