Detailed explanation of Vue's methods and properties

Vue methods and properties

1. Methods

Usage 1

methods: {
Method name: function(){},
}

Usage 2

methods: {
method name(){}
}

Notice

{ {}}Call to write()

Example

{ {aa()}}

Event triggering

@click=aa" can have () or not. If you need to pass parameters, add ()
Passing the special parameter $event can get the event object

2. Computed properties

What are computed properties?

computed

Characteristics of computed properties

1. Computed properties have cache
2. Computed properties are cached based on their dependencies.
3. Computed properties are only re-evaluated when their dependencies change.
4. When the properties that the calculated property depends on change, it will be recalculated.

Methods in computed properties

set(da)
get()

Example

 	computed:{
                 //Calculated properties//Calculated properties are cached//Directly call {{}} without writing ()
                 //When the attribute that the calculated attribute depends on changes, it will recalculate once bb(){
                    return this.arr.filter(a=>a.indexOf(this.search) > -1)
                 },
                 cc:{
                     //When the calculated property is called, the get method is automatically triggered, and when the calculated property is modified, the set method is automatically triggered set(a){
                        console.log('I am set'+"received content"+a+"received content")
                     },
                     get(){
                        console.log('I am get')
                        return this.arr.filter(a=>a.indexOf(this.search) > -1)

                     }
                 }
            },

This is the end of this article about Vue's methods and property cases. For more information about Vue's methods and properties, please search for previous articles on 123WORDPRESS.COM or continue to browse the following related articles. I hope you will support 123WORDPRESS.COM in the future!