This is the 22nd day of my participation in the August More Text Challenge
V computed is what?
Calculate attribute, the value of a variable according to the change of other variables (one or more), automatically reflect, calculate the new result.
Instead of computed, we can use methods. The effect is the same, but computed is based on its dependency cache, which is reevaluated only when the dependency changes.
With methods, functions are always called again when rendering again
The easiest thing to do when we compute a property and display it is to use computed.
The code is as follows:
<! DOCTYPE HTML > < HTML lang="en"> <head> <title>vue3 vuuE-0n </title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, Initial-scale =1.0"> <script SRC ="/vue3.1.5_vue.global.js"></script> </head> <body> <div id="wzApp"> <h3><a V - bind: href = "url" > click access - > child sauce @ CSDN blog < / a > < / h3 > < input v - model = "num1" / > < br / > < input v - model = "num2" / > < br / > < div > result {{result}} </div> <br/><div><input v-model="result" /> </div> </div> </body> <script> const { createApp, ref, computed } = Vue const url = 'https://blog.csdn.net/qq_28008615' const num1 = ref(0) const num2 = ref(1) const app = { /*const result1 = computed( ()=> int(num1.value) + int(num2.value) )*/ setup() { const result = computed( () => Number(num1.value) + Number(num2.value) ) return { url, num1, num2, result } } } createApp(app).mount('#wzApp') </script> </html>Copy the codeThe running effect is as follows:
We found that the computed property does not allow modification, and the console reported an error. Other readers should try writing some code for computed properties, but VUe3 is still a big enhancement.
conclusion
Computed properties: Fit to compute a property, and bind it.
Computed monitoring tracks changes in the values of different variables to automatically calculate new results.
For example, when doing game website equipment sales, you can change according to some state of the page. Change the skin, prompt all kinds of messages. It’s friendlier.
Like binding multiple items, once any one changes, affecting the overall value of the automatic settlement. Things like blogger points, nuggets, things like that, you can use this as a UI component.
That’s all for today.
I am meatball, learn a little knowledge every day. A front-end development hope to encourage more support, thank you