javascript - vue template syntax rules

Question

I just used vue, and I instinctively thought that in templates, strings or literals can only be passed in attributes by wrapping them in double quotes.

But the answer to this question tells me that it doesn’t seem to always be the case.

I’m not sure, in the template part of Vue, what identifies which part is html and which part is js? Just like jsx.

Answer 1

The value of a general instruction can be a js expression. Since it is a js expression, it satisfies the syntax of ES
v-bind="js expression"

Answer 2

Template is a component, and a component must have only one root node. The script tag is the JS part.

Answer 3

Vue is composed of a component:
<template>

<p>
//html部分
</p>

</template>

<script>
export defalt{

//js部分
data(){
    return{}//数据源
},
methods:{
    //函数体部分，js的主要逻辑控制
}

}
</script>

<style>

//针对上述html的css样式

</style>

See the official API for details