


watch listens for routing changes and watch listening objects (detailed tutorial)
Below I will share with you an example of using watch to monitor routing changes and watch monitoring objects. It has a good reference value and I hope it will be helpful to everyone.
1. Watch to monitor routing changes
Solution:
export default{ data(){ return{} }, watch:{ "$route":"getPath" // 监听事件 }, methods:{ getPath(){ let path = this.$roune.path; //或得当前路径 进行逻辑判断 } } }
2. Watch monitoring object
Example:
<el-select v-model="form.region" placeholder="请选择"> <el-option v-for="item in rootCategory" :key="item.id" :label="item.name" :value="item.id"> </el-option> </el-select> export default{ data(){ return{ form:{ region:"" } } }, watch:{ 'form.region':function(newValue,oldValue){ console.info(newValue); console.info(oldValue); } } }
The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.
Related articles:
p5.js introductory tutorial ball animation sample code
Angularjs Promise instance detailed explanation
Detailed explanation of the five methods of exporting Excel using JS
##
The above is the detailed content of watch listens for routing changes and watch listening objects (detailed tutorial). For more information, please follow other related articles on the PHP Chinese website!

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics

You may have encountered the problem of green lines appearing on the screen of your smartphone. Even if you have never seen it, you must have seen related pictures on the Internet. So, have you ever encountered a situation where the smart watch screen turns white? On April 2, CNMO learned from foreign media that a Reddit user shared a picture on the social platform, showing the screen of the Samsung Watch series smart watches turning white. The user wrote: "I was charging when I left, and when I came back, it was like this. I tried to restart, but the screen was still like this during the restart process." Samsung Watch smart watch screen turned white. The Reddit user did not specify the smart watch. Specific model. However, judging from the picture, it should be Samsung Watch5. Previously, another Reddit user also reported

We all know that the function of the listener is to trigger every time the reactive state changes. In the combined API, we can use the watch() function and watchEffect() function. When you change the reactive state, it may be triggered at the same time. Trigger Vue component updates and listener callbacks. By default, user-created listener callbacks will be called before the Vue component is updated. This means that the DOM you access in the listener callback will be the state it was in before it was updated by Vue. So, let’s take a look, how can we make good use of them? What's the difference between them? The watch() function watch needs to listen to a specific data source, such as listening to a ref. The first parameter of watch can be

How to monitor the scrolling of an iframe requires specific code examples. When we use the iframe tag to embed other web pages in a web page, sometimes we need to perform some specific operations on the content in the iframe. One of the common needs is to listen for the scroll event of the iframe so that the corresponding code can be executed when the scroll occurs. The following will introduce how to use JavaScript to monitor the scrolling of an iframe, and provide specific code examples for reference. Get the iframe element First, we need

How to use watch in Vue to monitor array changes. Vue is one of the most widely used frameworks in front-end development. It provides many convenient ways to implement functions such as data responsiveness, template rendering, and componentization. In Vue, we often use watch to monitor data changes. However, when we need to monitor array changes, we need to pay attention to some details. In Vue, we can use watch to monitor changes in a single property or object. The basic usage is as follows: watch:{

How to Access Control Center in watchOS 10 The way we interact with our watches has remained more or less the same since Apple launched the first Apple Watch. Even after adding so many new features, the overall user interface remains consistent. But watchOS10 brings big changes! On an Apple Watch running watchOS 9 or earlier, you can quickly open Control Center by swiping up on the screen. However, with the update to watchOS 10, the swipe-up gesture pulls up a whole new smart stack of widgets instead of Control Center. So the big question is how to open the Control Center on Apple Watch in WatchOS10. The answer is as follows:

The essence of watch The essence of watch is to observe a responsive data and notify and execute the corresponding callback function when the data changes. In fact, the essence of watch implementation is to use the effect and options.scheduler options. As shown in the following example: //The watch function receives two parameters, source is the responsive data, and cb is the callback function functionwatch(source,cb){effect(//Trigger the read operation to establish the connection ()=>source.foo ,{scheduler(){//When the data changes, call the callback function cbcb()}})} as shown in the above code

Vue component communication: using watch and computed for data monitoring Vue.js is a popular JavaScript framework, and its core idea is componentization. In a Vue application, data needs to be transferred and communicated between different components. In this article, we will introduce how to use Vue's watch and computed to monitor and respond to data. watch In Vue, watch is an option, which can be used to monitor the changes of one or more properties.

What you'll need: A new Apple Watch band A clean, soft cloth A flat, well-lit workspace Steps to change your Apple Watch band: 1. Remove the current band: Before you begin, place your Apple Watch face down on a clean, soft cloth to prevent the dial from being scratched. Press and hold the strap release button located on the back of the watch. The pusher is a small oval, flush with the watch body, where the two strap components join. While holding this button, slide the band over to remove it. You may need to apply a little force, but it should slide out relatively easily. Remember to remove both parts of the band. 2. Match the new band to your Apple Watch: Before installing the new band, make sure it matches your
