element ui的from表单数据转化为json对象

1. 表单数据

<el-form class="form" :label-position="labelPosition" label-width="100px" :model="formLabelAlign">
  <el-form-itemlabel="客厅数目" :rules="rules.living_room">
    <el-select v-model="formLabelAlign.living_room" placeholder="客厅数目">
      <el-option label="0" value="zero"></el-option>
      <el-option label="1" value="one"></el-option>
      <el-option label="2" value="two"></el-option>
      <el-option label="3" value="three"></el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="厨房数目" :rules="rules.kitchen">
    <el-select v-model="formLabelAlign.kitchen" placeholder="厨房数目">
      <el-option label="0" value="zero"></el-option>
      <el-option label="1" value="one"></el-option>
      <el-option label="2" value="two"></el-option>
      <el-option label="3" value="three"></el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="卧室数目" :rules="rules.bedroom">
    <el-select v-model="formLabelAlign.bedroom" placeholder="卧室数目">
      <el-option label="0" value="zero"></el-option>
      <el-option label="1" value="one"></el-option>
      <el-option label="2" value="two"></el-option>
      <el-option label="3" value="three"></el-option>
      <el-option label="4" value="four"></el-option>
      <el-option label="5" value="five"></el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="卫生间数目" :rules="rules.bathroom">
    <el-select v-model="formLabelAlign.bathroom" placeholder="卫生间数目">
      <el-option label="0" value="zero"></el-option>
      <el-option label="1" value="one"></el-option>
      <el-option label="2" value="two"></el-option>
      <el-option label="3" value="three"></el-option>
      <el-option label="4" value="four"></el-option>
      <el-option label="5" value="five"></el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="阳台数目" :rules="rules.balcony">
    <el-select v-model="formLabelAlign.balcony" placeholder="阳台数目">
      <el-option label="0" value="zero"></el-option>
      <el-option label="1" value="one"></el-option>
      <el-option label="2" value="two"></el-option>
      <el-option label="3" value="three"></el-option>
      <el-option label="4" value="four"></el-option>
      <el-option label="5" value="five"></el-option>
    </el-select>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" @click="onSubmit">查询</el-button>
  </el-form-item>
</el-form>

data() {
    return {
        labelPosition: "left",
        formLabelAlign: {
            living_room: '',
            kitchen: '',
            bedroom: '',
            bathroom: '',
            balcony: ''
        },
    }
}

2. 表单数据转化为json对象

核心: JSON.stringify(this.formLabelAlign)

methods: {
    onSubmit() {
        console.log(JSON.stringify(this.formLabelAlign));
    }
}

3. 示例