vue实现九宫格效果_vue 九宫格

效果图

 vue代码

<div class="centent" >
        <el-form ref="form" :model="queryParams">
          <el-row :gutter="10" type="flex" class="row-bg" justify="center" >
            <el-col :span="12"  v-for="(item,index) in form.slice(0,3)" :key="index">
              <div class="grid-content">
                <el-form-item prop="classificationName"><img :src="imgUrl"/>{
  {item.classificationName}}</el-form-item>               
                <el-form-item prop="operatingInstructionsDtoList">
                  <template slot-scope="scope">
                    <span v-for="(list,i