vue常用术语与常用指令

vue常用术语

1.挂载点

<div class="app">
</div>

2.vue实例
const app = Vue.createApp({}).mount(".app")
3.数据注入

const obj = {
            $data: {
                email: "123456789@qq.com",
            },
            get email() {
                return this.$data.email;
            },
        }

4.响应式
app.username = "李同学";

vue常用指令

v-text
<p>用户名:<span v-text="username"></span></p>
v-html
<p>用户名:<span v-html="username"></span></p>
app.username = '<span style="color:red">张同学</span>';
v-once
<p>用户名:<span v-once="username"></span></p>
样式绑定:v-bind,简化:冒号
<p v-bind:style="style">嗓子疼</p>
<p :class="['active','bgc']">一会就出去</p>
双向绑定v-model

<div class="app">
        <p>
            <input type="text" v-model="comment" :value="comment" />
            <span>{{comment}}</span>
        </p>
    </div>