<el-row style="flex-wrap: wrap;height: 500px;overflow-y: auto;"> <el-col :span="3" style="text-align:center;padding-top:20px;" v-for="(item,index) in processList" :key="index" @click.native="createProcess(item)"> <span> <!-- <svg-icon icon-class="menu" class-name="menu"/>--> <svg-icon :icon-class="item.imagePath" class-name="menu" /> </span> <span>{{ item.processName }}</span> </el-col> </el-row> 让他每行居左开始

要让el-col每行居左开始，您可以使用flex布局的`justify-content`属性来实现。将`justify-content`设置为`flex-start`，即可使每行元素左对齐。

以下是修改后的代码示例：

<el-row style="flex-wrap: wrap;height: 500px;overflow-y: auto; justify-content: flex-start;">
  <el-col :span="3" style="text-align:center;padding-top:20px;" v-for="(item,index) in processList" :key="index"
          @click.native="createProcess(item)">
    <span>
      <svg-icon :icon-class="item.imagePath" class-name="menu" />
    </span>
    <span>{{ item.processName }}</span>
  </el-col>
</el-row>

在修正后的代码中，我们在`el-row`元素上添加了`justify-content: flex-start;`样式，使得每行的元素居左开始对齐。

希望这个修正能够满足您的需求。如果还有其他问题，请随时提出。

相关问题

<el-row style="display:flex;justify-content:lift;align-items:center;width: 100%; height: 100%"> <el-col style="display:flex;justify-content:lift;align-items:center;width: 100%; height: 100%;"> <el-card class="card-box" style="display:flex;width=200px;height=110px;border-radius: 10px;"> card1 </el-card> </el-col> <!-- <el-col style="display:flex;justify-content:lift;align-items:center;width: 200px; height: 200px"> <el-card style="display:flex;width=200px;height=100px">card2</el-card> </el-col> --> </el-row>为什么我设置的card高度与宽度不起作用

你设置的card高度与宽度不起作用可能是因为你在样式中使用了等于号（=）而不是冒号（:）。正确的写法应该是：`width: 200px; height: 110px;`。此外，你的样式中还存在一些拼写错误，例如 `justify-content:lift` 应该是 `justify-content: left`。你可以修改这些错误后再尝试一下是否能够正确设置card的高度与宽度。

<mf-grid v-if="dialogFooter && dialogFooter.key" :key="dialogFooter.key" :element="dialogFooter" :columns="dialogFooter.columns" :height="dialogFooter.height" :styleClass="getStyleClass" :rendered.sync="dialogFooter.rendered" :currentFormData="currentFormData" ></mf-grid> <el-row v-else v-if="clickEnable"> <el-col :span="8"> <div style="min-height: 36px;"></div> </el-col> <el-col :span="8" style="text-align: center;"> <el-button type="primary" @click="save" style="width:100%">提交</el-button> <!-- <el-button type="primary" @click="closePage" style="margin-right: 15px;">关闭</el-button>--> </el-col> <el-col :span="8"> <div style="min-height: 36px;"></div> </el-col> </el-row>

这段代码看起来像是一个Vue组件的模板（template），包含了两种可能的情况：

1. 如果`dialogFooter`对象存在且`key`属性存在，就渲染一个名为`mf-grid`的自定义组件，传入相应的props和事件处理函数。
2. 如果`dialogFooter`不存在或者`key`属性不存在，则渲染一个`el-row`元素，内部包含三个`el-col`元素，其中第二个`el-col`元素包含一个`el-button`元素，点击该按钮会触发`save`函数。