写了个代码生成工具，vue + element-ui的可以来瞧瞧_javascript_weixin

写代码是比较枯燥的，茫茫多的业务代码更加枯燥了，实现需求的时候，特别是一些管理平台，无外乎一些表单、表格、弹框等，项目用的是vue + element-ui

eg: 弹框在业务里面几乎是都会用到，下面?这个模版应该是每个弹框的代码都可以公用；平时问了一些朋友同事，大部分都是复制下之前实现的一些需求代码，然后粘贴出来删删改改

<template>
    <el-dialog
        :title='dialogTitle'
        :visible.sync='innerVisible'
        @confirm='onConfirm'
        @close='onClose'
        @open='onOpen'
    >
        <!--XXX-->
    </el-dialog>
</template>

<script>
export default {
    props: {
        visible: {
          type: Boolean,
          default: false
        }
    },
    computed: {
        innerVisible: {
          get() {
            return this.visible
          },
          set(newVal) {
            this.$emit('update:visible', newVal)
          }
        },
        dialogTitle() {
          // TODO: write your code
          return '弹框标题'
        }
    },
    methods: {
        onConfirm() {
          // TODO: write your code
        },
        onClose() {
          // TODO: write your code
        },
        onOpen() {
          // TODO: write your code
        }
    }
}
</script>
复制代码

eg: 再来看下表单代码

<template>
  <el-form
    ref="form"
    class="form"
    :model="formModel"
    :rules="formRules"
    :label-width="labelWidth"
  >
    <el-form-item
      prop="label1"
      label="表单项1"
    >
      <el-input
        v-model="formModel.label1"
        placeholder="请输入"
      >
      </el-input>
    </el-form-item>
    <el-button
      type="primary"
      @click="onSubmit"
    >
    </el-button>
  </el-form>
</template>

<script>
export default {
  data() {
    return {
      labelWidth: "100px"
      formModel: {
        // TODO: write your code
        label1: undefined
      },
      formRules: {
        // TODO: write your code
        label1: [
          { required: true, message: '不可为空' }
        ]
      }
    }
  },
  components: {
    // TODO: write your code
  },
  methods: {
    onSubmit() {
      this.$refs.form.validate(valid => {
        if (!valid) return
        // TODO: write your code
      })
    }
  },
  computed: {
    // TODO: write your code
  }
}
</script>
复制代码