Skip to content

form submit get empty values #15

@jonashao

Description

@jonashao

表单提交时,表单值为空

问题复现步骤:

代码:

<template>
  <form @submit="formSubmit" @reset="formReset">
          <mp-field placeholder="请输入您的姓名" name='name' label="姓名" />
          <mp-field placeholder="请输入您的手机号" type="number" name='mobile' label="手机号" />
          <button formType="submit" size='large'>提交</button> 
 </form>
</template>

<script>
import MpField from 'mp-weui/packages/field';

export default {
  components: {
    MpField
  },
  methods: {
    formSubmit (e) {
      let { value } = e.target;
      console.log('表单内容',value);
      console.log('form发生了submit事件,携带数据为:', e);
    },
    formReset () {
      console.log('form发生了reset事件');
    }
  }
};
</script>

期望的表现:
输入表单后,点击提交,
form的 @submit事件中,可以打印出表单输入的值。

观察到的表现:
输入表单后,点击提交,
form的 @submit事件中,一直打印出空字典。

若将mp-field 改为 input, 则可以得到预期的表现。
原因是因为表单提交时,会根据 inputname属性获取表单各个字段的值,
而 mp-filed 没有将name属性传递给 input,导致无法获取到表单的值。

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions