In addition to Weibo, there is also WeChat
Please pay attention
WeChat public account
Shulou
2025-04-02 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >
Share
Shulou(Shulou.com)05/31 Report--
In this article, the editor introduces in detail "how to use vue3 updated setup grammar sugar". The content is detailed, the steps are clear, and the details are handled properly. I hope this "vue3 updated setup grammar sugar how to use" article can help you solve your doubts.
Syntax sugar usage: / / add `setup` attribute to the ``code block / / the code in the `setup` code block will be compiled into the content of the component `setup` function / / it is so simple and clear about the experience brought by syntax sugar: 1. Automatic registration of components / / without using components, registration immediately after introduction, whether there is import MyComponent from'. / MyComponent.vue' 2. Attributes and methods do not need return// when using`` Any binding / / (including variables, function declarations, and content introduced by import) at the top level of the ``declaration can directly use the import {ref} from 'vue'// variable let msg = ref (' hellograms') / / function function log () {msg.value = "World!" in the template. Console.log (msg)} {{msg}} III. Automatically define the file name as the name attribute of the component
API provided by grammatical sugar
You must use defineProps and defineEmits API to declare props and emits in
1. DefinePropsconst props = defineProps ({foo: String}) 2, defineEmitsconst emit = defineEmits (['change',' delete']) / / emit ('change',' 1111') 3, defineExpose
If the child component instance is obtained through the ref='xxx' method in the parent component, and the child component is used, the data of the child component needs to be exported in the way of defineExpose, otherwise its properties will not be exposed
Import {ref} from 'vue'const a = 1const b = ref (2) defineExpose ({a, b})
It can be used with ordinary ones.
/ / normal, execute under the scope of the module (only once) / / declare additional options, such as custom component name export default {name: 'component 1'} / / code. This article "how to use setup Syntax Sugar updated by vue3" has been introduced. If you want to master the knowledge of this article, you still need to practice and use it yourself. If you want to know more about related articles, welcome to follow the industry information channel.
Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.
Views: 0
*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.
Continue with the installation of the previous hadoop.First, install zookooper1. Decompress zookoope
"Every 5-10 years, there's a rare product, a really special, very unusual product that's the most un
© 2024 shulou.com SLNews company. All rights reserved.