{"id":37,"date":"2022-11-08T11:39:42","date_gmt":"2022-11-08T11:39:42","guid":{"rendered":"http:\/\/www.devopsconsulting.in\/blog\/?p=37"},"modified":"2022-11-08T11:39:42","modified_gmt":"2022-11-08T11:39:42","slug":"what-is-vue-js-watch-property","status":"publish","type":"post","link":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/","title":{"rendered":"what is Vue.js Watch Property"},"content":{"rendered":"\n<h3 class=\"wp-block-heading\">Watch Property<\/h3>\n\n\n\n<p>Vue.js is a very powerful and reactive JavaScript framework, which is used to build Uis (User Interfaces) and SPAs (Single-page Applications).<\/p>\n\n\n\n<p>Vue.js provides the watch property to observe and react to the variables or data change. We can use the watch property to manipulate the DOM when the watched variable gets changed.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Example<\/h4>\n\n\n\n<script src=\"https:\/\/gist.github.com\/abhishek7079\/bb37e1b707c0a7a5ee9bbc16f352046a.js\"><\/script>\n\n\n\n<p>After the execution of the program, you will see the following output:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">OutPut:<\/h4>\n\n\n\n<p><strong>Before entering value in input field<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"658\" height=\"54\" src=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-3.png\" alt=\"\" class=\"wp-image-38\" srcset=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-3.png 658w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-3-300x25.png 300w\" sizes=\"auto, (max-width: 658px) 100vw, 658px\" \/><\/figure>\n\n\n\n<p><strong>After entering value in input field<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"652\" height=\"61\" src=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-4.png\" alt=\"\" class=\"wp-image-39\" srcset=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-4.png 652w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-4-300x28.png 300w\" sizes=\"auto, (max-width: 652px) 100vw, 652px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Watch Property Vue.js is a very powerful and reactive JavaScript framework, which is used to build Uis (User Interfaces) and SPAs (Single-page Applications). Vue.js provides the watch&#8230; <\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-37","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>what is Vue.js Watch Property - DevOps Consulting<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"what is Vue.js Watch Property - DevOps Consulting\" \/>\n<meta property=\"og:description\" content=\"Watch Property Vue.js is a very powerful and reactive JavaScript framework, which is used to build Uis (User Interfaces) and SPAs (Single-page Applications). Vue.js provides the watch...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/\" \/>\n<meta property=\"og:site_name\" content=\"DevOps Consulting\" \/>\n<meta property=\"article:published_time\" content=\"2022-11-08T11:39:42+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-3.png\" \/>\n<meta name=\"author\" content=\"Abhishek Singh\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Abhishek Singh\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/\"},\"author\":{\"name\":\"Abhishek Singh\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#\\\/schema\\\/person\\\/fc397ba8be42f9fdd53450edfc73006f\"},\"headline\":\"what is Vue.js Watch Property\",\"datePublished\":\"2022-11-08T11:39:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/\"},\"wordCount\":88,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/image-3.png\",\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/\",\"url\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/\",\"name\":\"what is Vue.js Watch Property - DevOps Consulting\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/image-3.png\",\"datePublished\":\"2022-11-08T11:39:42+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#\\\/schema\\\/person\\\/fc397ba8be42f9fdd53450edfc73006f\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/what-is-vue-js-watch-property\\\/#primaryimage\",\"url\":\"http:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/image-3.png\",\"contentUrl\":\"http:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/image-3.png\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/\",\"name\":\"DevOps Consulting\",\"description\":\"DevOps Consulting | SRE Consulting | DevSecOps Consulting | MLOps Consulting\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#\\\/schema\\\/person\\\/fc397ba8be42f9fdd53450edfc73006f\",\"name\":\"Abhishek Singh\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g\",\"caption\":\"Abhishek Singh\"},\"description\":\"I\u2019m Abhishek, a DevOps, SRE, DevSecOps, and Cloud expert with a passion for sharing knowledge and real-world experiences. I\u2019ve had the opportunity to work with Cotocus and continue to contribute to multiple platforms where I share insights across different domains: \u2022 DevOps School \u2013 Tech blogs and tutorials \u2022 Holiday Landmark \u2013 Travel stories and guides \u2022 Stocks Mantra \u2013 Stock market strategies and tips \u2022 My Medic Plus \u2013 Health and fitness guidance \u2022 TrueReviewNow \u2013 Honest product reviews \u2022 Wizbrand \u2013 SEO and digital tools for businesses I\u2019m also exploring the fascinating world of Quantum Computing.\",\"url\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/author\\\/abhishek\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"what is Vue.js Watch Property - DevOps Consulting","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/","og_locale":"en_US","og_type":"article","og_title":"what is Vue.js Watch Property - DevOps Consulting","og_description":"Watch Property Vue.js is a very powerful and reactive JavaScript framework, which is used to build Uis (User Interfaces) and SPAs (Single-page Applications). Vue.js provides the watch...","og_url":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/","og_site_name":"DevOps Consulting","article_published_time":"2022-11-08T11:39:42+00:00","og_image":[{"url":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-3.png","type":"","width":"","height":""}],"author":"Abhishek Singh","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Abhishek Singh"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/#article","isPartOf":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/"},"author":{"name":"Abhishek Singh","@id":"https:\/\/www.devopsconsulting.in\/blog\/#\/schema\/person\/fc397ba8be42f9fdd53450edfc73006f"},"headline":"what is Vue.js Watch Property","datePublished":"2022-11-08T11:39:42+00:00","mainEntityOfPage":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/"},"wordCount":88,"commentCount":0,"image":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/#primaryimage"},"thumbnailUrl":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-3.png","inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/","url":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/","name":"what is Vue.js Watch Property - DevOps Consulting","isPartOf":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/#primaryimage"},"image":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/#primaryimage"},"thumbnailUrl":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-3.png","datePublished":"2022-11-08T11:39:42+00:00","author":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/#\/schema\/person\/fc397ba8be42f9fdd53450edfc73006f"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.devopsconsulting.in\/blog\/what-is-vue-js-watch-property\/#primaryimage","url":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-3.png","contentUrl":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-3.png"},{"@type":"WebSite","@id":"https:\/\/www.devopsconsulting.in\/blog\/#website","url":"https:\/\/www.devopsconsulting.in\/blog\/","name":"DevOps Consulting","description":"DevOps Consulting | SRE Consulting | DevSecOps Consulting | MLOps Consulting","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.devopsconsulting.in\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.devopsconsulting.in\/blog\/#\/schema\/person\/fc397ba8be42f9fdd53450edfc73006f","name":"Abhishek Singh","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g","caption":"Abhishek Singh"},"description":"I\u2019m Abhishek, a DevOps, SRE, DevSecOps, and Cloud expert with a passion for sharing knowledge and real-world experiences. I\u2019ve had the opportunity to work with Cotocus and continue to contribute to multiple platforms where I share insights across different domains: \u2022 DevOps School \u2013 Tech blogs and tutorials \u2022 Holiday Landmark \u2013 Travel stories and guides \u2022 Stocks Mantra \u2013 Stock market strategies and tips \u2022 My Medic Plus \u2013 Health and fitness guidance \u2022 TrueReviewNow \u2013 Honest product reviews \u2022 Wizbrand \u2013 SEO and digital tools for businesses I\u2019m also exploring the fascinating world of Quantum Computing.","url":"https:\/\/www.devopsconsulting.in\/blog\/author\/abhishek\/"}]}},"_links":{"self":[{"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/posts\/37","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/comments?post=37"}],"version-history":[{"count":1,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/posts\/37\/revisions"}],"predecessor-version":[{"id":40,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/posts\/37\/revisions\/40"}],"wp:attachment":[{"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/media?parent=37"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/categories?post=37"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/tags?post=37"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}