入门：Vue六大常用内置指令

指令（Directives），是vue为开发者提供的 模板语法 ，用于辅助开发者渲染页面的基本结构

所用到的数据定义在实例的 data 中，事件定义在实例的 methods 中

只能渲染纯文本内容， 会覆盖 标签内部原本的内容

只能渲染纯文本内容， 不会覆盖 标签内部原本的内容

能将带标签的字符串渲染成html内容， 会覆盖 标签内部原本的内容

为元素的属性 动态 绑定属性值

注意： 插值表达式 和 v-bind 还支持javascript表达式的运算

为元素绑定事件

只要是事件，就能使用的修饰符，以下列举5个常用的

只能在触发键盘事件时，使用的修饰符，以下列举2个常用的

快速获取表单数据（只应用于表单元素，如：input、textarea、select）

只能给v-model使用的修饰符

控制DOM的显示与隐藏（值为true显示，值为false隐藏），其原理为 动态添加/移除display：none样式 ，一般用于需频繁切换

控制DOM的显示与隐藏（值为true显示，值为false隐藏），其原理为 动态创建/移除元素 ，一般用于默认不展示且展示较少

配合 v-if 指令一起使用，否则将不会被识别

基于一个数组来循环渲染一个列表结构，它有特定的语法结构 v-for="item in items"

注意：在vue文件中，只要用到 v-for指令 ，一定要绑定一个 :key 属性

作者：用户2031777005900
链接：>1点击某个标签，滚动到某个具体位置

    switchHeight(num) {

        thisselectNum = num;

        if (num == 0) {

          documentgetElementById("identifer_one")scrollIntoView();

        } else {

          documentgetElementById("hotel_two")scrollIntoView();

        }

      },

2获取滚动高度，

 首先要先写监听事件：

  mounted() {

      windowaddEventListener("scroll", thishandleScroll, true); //监听滚动事件

    },

处理监听事件：etargetscrollTop是目标对象的滚动高度

handleScroll(e) {

        let serviceTop = 44;

        let hotelTop = 344;

        if (etargetscrollTop > 44 && etargetscrollTop < 344) {

          thisselectNum = 0;

        }

        if (etargetscrollTop > 344) {

          thisselectNum = 1;

        }

      }

    },

最近项目里需要用到下拉框来动态获取年份，网上找的时候大部分都是js写的，这里记录下用vue来实现。

项目需求：下拉框动态获取年份
项目环境：vue + vue cli +element-ui + select选择器

最终效果：

我们先看看通过接口回来的数据

其中，defaultType是需要回显的内容，即原选定的分类

需要保证select下拉的ID和v-model里边的id保持一致

---