如何基于element 封装一个表单容器，默认一行多列，里面的el-form-item可以自己控制一行占多少列这样的？

Question

萌新报道，可能说不清楚是什么意思 直接贴代码吧

刚来公司就让我用vue+element封装组件，并且还能在静态页面里面可以用，好崩溃，不知道怎么做，求大神帮忙
最好是能够贴出源码注释，谢谢

Answer 1

用flex吧，不过说实话，表单的样式不好控制。你公司给你挖了一个大坑，PC还好，就比如说移动端h5页面的一行三列表单项你光想象就知道那样式有多难看。

props: {
  col: {
    type: Number,
    default: 3
  }
},
data () {
  items: []
},
computed: {
  // 计算会生成多少行, 然后在template里面循环生成元素
  rowNum () {
    let len = this.items.length
    return len % this.col === 0 ? len / this.col : (len / this.col >> 0) + 1
  }
}