JSFiddle - React, Tailwind, and code Playground

by leopoldthecuber

HTML

<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui/lib/index.js"></script>
<div id="app">
<div class="block">
  <span class="demonstration">起始</span>
  <el-date-picker v-model="value4" type="month" placeholder="选择月">
  </el-date-picker>
</div>
<div class="block">
  <span class="demonstration">结束</span>
  <el-date-picker v-model="value5" type="month" placeholder="选择月" :picker-options="options">
  </el-date-picker>
</div>
</div>

SCSS

@import url("//unpkg.com/element-ui/lib/theme-default/index.css");

Babel + JSX

var Main = {
    data() {
      const self = this;
      return {
        value4: '',
        value5: '',
        options: {
          disabledDate(date) {
            if (date.getFullYear() < self.value4.getFullYear()) {
              return true;
            } else if (date.getFullYear() > self.value4.getFullYear()) {
              return false;
            } else if (date.getMonth() <= self.value4.getMonth()) {
              return true;
            } else {
              return false;
            }
          }
        }
      };
    }
  };
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')