Vue3: setup syntax sugar

1. setup syntax sugar

 Write setup directly on the <script> tag, then the following statement does not need return variables and functions, which is convenient to use

2.ref use

Before using ref, you need to import ref

It can only be used after importing, otherwise an error will be reported

 define ref data

const open=ref(false)

Use [open] directly in html, use [open.value] in script

Like this kind of object or array, use [formInline.billNo] in html, and [formInline.value.billNo] in script 

3. Hook function class

The first step still needs to be introduced before it can be used

 It can be used directly in the script environment

onMounted(()=>{

 })

 4. Ordinary functions

const handleSizeChange=()=>{
    labellist()
}

Use const to declare a variable and use it in conjunction with arrow functions

When calling, there is no need to add this, just call it directly.

5. Spread operator

When a form is already defined, it can be cloned using the spread operator

const form1=ref({
   ...form.value
})