JSFiddle - React, Tailwind, and code Playground

by leopoldthecuber

HTML

<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/[email protected]/lib/index.js"></script>
<div id="app">
<el-form label-width="100px">
  <el-form-item label="name">
    <el-input v-model="value.name"></el-input>
  </el-form-item>
  <el-form-item label="address">
    <el-input v-model="value.address"></el-input>
  </el-form-item>
  <el-form-item>
    <el-button :disabled="disabled">Submit</el-button>
  </el-form-item>
</el-form>
  
</div>

SCSS

@import url("//unpkg.com/[email protected]/lib/theme-default/index.css");

Babel + JSX

var Main = {
    computed: {
      disabled() {
        return Object.keys(this.value).some(key => this.value[key] === '')
      }
    },
    data () {
      return {
        value: {
          name: '',
          address: ''
        }
      };
    }
  }
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')