Vue day01

1、v-text/v-html

   v-text：会替换掉元素里的内容，v-html：可以渲染html界面

   相同点：覆盖元素原来的节点

   不同点：v-text不能解析富文本，v-html:可以解析富文本

        富文本：标签以及标签里的属性组成的字符串

1. 1、引入js;

1. 视图层； div id=app

   插值表达式

1. 实例化

el: '#app'

// 存放数据 data:{}，// 方法 methods: {}

3、v-model 是Vue框架的一种内置的API指令，本质是一种语法糖写法。它负责监听用户的输入事件以更新数据，并对一些极端场景进行一些特殊处理。

v-model指令可以在表单 input、textarea以及select元素上创建双向数据绑定它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇，但 v-model 本质上不过是语法糖，它负责监听用户的输入事件来更新数据，并在某种极端场景下进行一些特殊处理

表单提交是开发中非常常见的功能，也是和用户交互的重要手段：比如用户在登录、注册时需要提交账号密码；比如用户在检索、创建、更新信息时，需要提交一些数据； 这些都要求我们可以在代码逻辑中获取到用户提交的数据，我们通常会使用v-model指令来完成

一句话理解就是更新数据（动态）信息

4、 // 清空定时器

                    clearInterval(this.timer)

                    this.timer = setInterval(() => {

                        let first = this.msg.slice(0, 1)

                        let end = this.msg.slice(1)

                        this.msg = end + first

                        // 尾部连着头

5、

1. .stop 阻止冒泡 /2、.capture 添加事件侦听器时使用事件捕获模式

.self 只当事件在该元素本身（比如不是子元素）触发时触发回调/ 4、.once 事件只触发一次

5、.prevent 阻止默认事件

6、   // 冒号里要有空格

                    this.class1 += '  word'

7、

            key:必须是唯一值，必须是字符串或者数字

            key的作用：提高重排效率，就地复用。

       

        <!-- <div v-for="(item,index) in list" :key="item.id">

8、 v-if v-show的异同：

            相同点：显示隐藏元素

            不同点：v-if是删除DOM元素

                   v-show:通过display:none隐藏元素

            应用场景：v-if用于一次显示隐藏

                     v-show用于多次