Vue.js El-table 阶段选择导致数据变化问题解决

根据您提供的代码片段，可以看出选择阶段后，第二行的数据也会跟着变化的原因可能是由于stageSno属性是在Vue实例中定义的一个变量。当选择阶段后，handleStageChange方法被调用，可能会修改了stageSno的值，导致第二行数据也发生了变化。

要解决这个问题，您可以在<el-select>中使用一个独立的变量来表示每一行的阶段选择。例如，可以将每一行的stageSno定义为一个数组，然后在handleStageChange方法中，根据行索引来更新相应的阶段选择。

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

<el-table-column
  label="项目阶段"
  align="center"
  prop="stageNames"
  show-overflow-tooltip
>
  <template slot-scope="scope">
    <el-select
      v-model="stageSno[scope.$index]"
      placeholder="请选择"
      clearable
      @change="handleStageChange(scope.$index, stageSno[scope.$index])"
    >
      <el-option
        v-for="dict in scope.row.stageNames"
        :key="dict.id"
        :label="dict.name"
        :value="dict.id"
      />
    </el-select>
  </template>
</el-table-column>

然后，在handleStageChange方法中，可以根据行索引来更新相应的阶段选择：

handleStageChange(index, value) {
  // 根据索引更新相应的阶段选择
  this.stageSno.splice(index, 1, value);
}

这样，每一行的阶段选择就会独立存储，选择一个阶段后，不会影响其他行的数据。