Forms 如何在Vue中从B-modal提交表单数据

因此，我在尝试从Vue组件中的

b-modal

提交表单数据时遇到问题。我可以在我的开发工具中看到数据对象正在填充数据，但是当我提交表单时，它不会发送数据

这是表格

 <b-modal v-model="modalShow" id="myModal">
      <form>
        <div>
          <br>
            <input type="text" placeholder="Name" v-model="user.name">
          <br>
            <input type="text" placeholder="Email" v-model="user.email">
          <br>
            <input type="text" placeholder="Password" v-model="user.password">
          <br>
        </div>
        <div>
          <b-btn @click="modalShow = false">Cancel</b-btn>
          <b-btn variant="outline-primary" @click="addUser">Create</b-btn>
        </div>
      </form>
    </b-modal>

这是正在调度的存储方法

addUser(user) {
      return new Promise((resolve, reject) => {
        axios.post('/register', {
          name: user.name,
          email: user.email,
          password: user.password,
        })
        .then(response => {
          console.log(response)
          resolve(response)
        })
        .catch(error => {
          reject(error.response.data)
        })
      })
    },

如果在处理后端数据之前执行返回响应，则会显示一个空数据对象。你知道为什么吗？

第一个参数是

上下文

对象，而

有效载荷

作为第二个参数传递

addUser(context, user) {
      return new Promise((resolve, reject) => {
        axios.post('/register', {
          name: user.name,
          email: user.email,
          password: user.password,
        })
        .then(response => {
          console.log(response)
          resolve(response)
        })
        .catch(error => {
          reject(error.response.data)
        })
      })
    }

---

axios.post（'/register'，{name:user.name，email:user.email，password:user.password，}）this.user.name，this.user.email，this.user.passwordTest@HamiltonGabriel，您是说将

name:user.name

更改为

name:this.user.name

？正确，测试一下。@HamiltonGabriel，查看答案。是的，我过了一会儿才明白，不过谢谢你的评论

addUser(context, user) {
      return new Promise((resolve, reject) => {
        axios.post('/register', {
          name: user.name,
          email: user.email,
          password: user.password,
        })
        .then(response => {
          console.log(response)
          resolve(response)
        })
        .catch(error => {
          reject(error.response.data)
        })
      })
    }