Computed attributes: The existing attributes in the data need to be processed before displaying
Monitoring attributes: The attributes defined in the data need to be monitored, and will be notified after changes.
Computed properties
1. Definition: The element to be used does not exist and must be calculated from existing attributes.
2. Principle: The bottom layer uses the getter and setter provided by the object.definepropety method
3.When is the get function executed?
(1) It will be executed once when reading for the first time.
(2) When the dependent data changes, it will be read again
4. Advantages: Compared with method implementation, there is an internal caching mechanism, which is more efficient and easy to debug.
5. Remarks:
1. The calculated attributes will eventually appear on the vm and can be read and used directly.
2. If the computer attributes are to be modified, the set attribute must be used to respond to the modification, and the set must cause the data relied upon during calculation to change.
Monitor watch
1. When the monitored attribute changes, the callback function is automatically called to perform related operations.
2. The monitored attributes must exist
3. Two ways of writing surveillance
(1). Pass in the watch configuration when new Vue
(2). Monitor through vm.$watch
4. Attribute: immediate is a boolean type, used to set whether the attribute needs to be executed once during initialization.
5. Deep monitoring:
(1). The watch in Vue does not monitor changes in the internal values of the object by default (one layer)
(2). After configuring deep:true, you can detect the attribute values in the object (multi-value)
Remark:
(1).Vue itself can detect changes in the internal values of objects, but the watch provided by vue cannot by default.
(2). When using watch, decide whether to use in-depth monitoring based on the specific structure of the data.
//当只监测某一个深度属性时，就需要具体指定某个属性时，需要使用字符串形式包裹
//eg:"person.id"
watch:{
person:{
deep:true,
handler(){
alert("debdhsjfbd")
}
}
}