Vue-EIement

        最近工作调整的原因，开始接触Vue+java B/S 软件开发，哎呀，小编一看B/S就是一个头两个大，所以做做笔记吧！

        EIement参考网址：Element - 网站快速成型工具

        1. Select 选择器

<1>  普通单选用法

//clearable 属性，则可将选择器清空。需要注意的是，clearable属性仅适用于单选。
//disabled 属性，则整个选择器选项不可选中。
//multiple 属性即可启用多选，此时v-model的值为当前选中值所组成的数组。默认情况下选中值会以 Tag 的形式展现,可以设置collapse-tags属性将它们合并为一段文字。

<template>
  <el-select v-model="value" clearable placeholder="请选择">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
  </el-select>
  <el-select v-model="value" placeholder="请选择">
    <el-option
      v-for="item in  arr"
      :key="item"
      :label="item"
      :value="item"
      :disabled="isOptionDisabled(item)">  
    </el-option>
  </el-select>
</template>

<script>
  export default {
    data() {
      return {
        options: [{
          value: '选项1',
          label: '选项1'
        }, {
          value: '选项2',
          label: '选项2',
          disabled: true       //此选项禁止选择
        }, {
          value: '选项3',
          label: '选项3'
        }, {
          value: '选项4',
          label: '选项4'
        }, {
          value: '选项5',
          label: '选项5'
        }],
       arr:[],
       disabledOptions: ["5", "6", "11"] // 添加这一行，定义禁止的选项  
      }
    }，

    // created钩子是在组件创建完成后立即执行的，可以在此时进行一些初始化的操作。
    created() {  
    arr=["1","2"];
    },

    //mounted钩子函数是在DOM渲染完成后执行的
    mounted() {  
    this.arr = ["5", "6"]; 
    this.arr.push("4");
    } 
  }
</script>

<2> 多选、自定义、分组、搜索等.......