The computed attribute is to simplify the computational complexity of the template string in the template and prevent the template from being too redundant. it has caching properties
Computed is used to monitor the variables defined by oneself. This variable is not declared in data, but directly defined in computed, and then two-way data binding can be performed on the page to display the results or be used for other processing;
watch is mainly used to monitor the changes of vue instances. Of course, the variables it monitors must be declared in data. It can monitor a variable or an object. It is generally used to monitor routing, special processing of the value of the input input box, etc. , it is more suitable for scenarios where one data affects multiple data, and it is not cacheable
watch: It monitors the attribute value. As long as the attribute value changes, it will trigger the execution of the callback function to perform a series of operations.
computed: It monitors the dependent value. If the dependent value remains unchanged, it will directly read the cache for multiplexing, and it will recalculate when it changes.
In addition, there is a very important difference: Computed properties cannot perform asynchronous tasks, and computed properties must perform synchronous tasks . That is to say, computed properties cannot request or perform asynchronous tasks from the server. If an asynchronous task is encountered, it is handed over to the listening property. Watch can also detect computed attributes.