Пользовательский ввод из формы не публикуется в базе данных? (топор ios, mongodb, vue) - PullRequest
Новая
       7

Пользовательский ввод из формы не публикуется в базе данных? (топор ios, mongodb, vue)

0 голосов
/ 17 апреля 2020

Я новичок в vue и пытаюсь опубликовать данные из пользовательского ввода на моем mongodb. Я использую топор ios для извлечения и публикации данных. В то время как данные из базы данных отображаются на моей странице, я не могу получить данные формы для публикации. Я даже не получаю никаких сообщений об ошибках, они просто не публикуются. Я с нетерпением жду вашего ответа, чтобы сообщить мне, что я делаю неправильно. Вот моя страница AddUser. vue, от клиента 

    <template>
<div>
    <h1>Registration</h1>
    <p>First name: </p>
    <b-form-input v-model="firstname">
    </b-form-input>
    <p>Last name: </p>
    <b-form-input v-model="lastname">
    </b-form-input>
    <p>Email: </p>
    <b-form-input v-model="email">
    </b-form-input>
    <p>Password: </p>
    <b-form-input v-model="password">
    </b-form-input>
    <br>
    <button v-on:click="submitNew">Submit</button>
</div>
</template>

<script>
import UserService from "../UserService";

export default {
    name: "UserEdit",
    data(){
        return {
            editUsers: this.$route.query.user,
            editStatus: "",
            user: {}
        }
    },
    methods: {
        submitNew(){
            try{
                this.user = UserService.addUsers;
            } catch (err) {
                this.error = err.message;
            }
            this.cancel();
        }
    },
    watch :{
        $route: "updateRouter"
    }
}
</script>

Вот мой UserService. vue, от клиента 

import axios from "axios";
const mongoURL = "http://localhost:5000/api/posts";

class UserService{
    static getUsers(){
        return new Promise(async (resolve,reject)=> {
            try{
                const res = await axios.get(mongoURL);
                const users = res.data;
                resolve(
                    users.map((users) =>({
                        ...users,
                    }))
                );
            } catch (err) {
                reject (err);
            }

    });
    }

    static addUsers(user){
        return axios.post(mongoURL, {
            user
        })
    }

export default UserService;

Вот моя модель для пользователей. js, с сервера 

const mongoose = require('mongoose');

const User = mongoose.model("User",{
    firstname: {
        type: String,
        required: true,
        trim: true
    },
    lastname: {
        type: String,
        required: true,
        trim: true
    },
    email: {
        type: String,
        required: true,
        trim: true
    },
    password: {
        type: String,
        required: true
    }
})

module.exports = User;

Вот мои посты. js, с сервера 

const express = require("express"),
      mongoose = require("mongoose"),
      User = require("../models/Users.js"),
      router = express.Router();

      router.get("/", async (req,res)=>{
          try {
              const user = await User.find({});
              res.send(user);
          } catch (error){
              res.status(500).send(error);
          }
      });

      router.post("/", async(req,res)=>{
          console.log(req.body["user"]);
          const user = new User(req.body["user"])
          console.log(user);
          try{
              await user.save
              console.log(user)
          } catch(err){
              res.status(550).send(err);
          }
      })

      module.exports = router;

1 Ответ

0 голосов
/ 17 апреля 2020 
<template>
    <div>

        <h1>Registration</h1>

        <p>First name: </p>

        <b-form-input v-model="user.firstname">

        </b-form-input>

        <p>Last name: </p>

        <b-form-input v-model="user.lastname">

        </b-form-input>

        <p>Email: </p>

        <b-form-input v-model="user.email">

        </b-form-input>

        <p>Password: </p>

        <b-form-input v-model="user.password">

        </b-form-input>

        <br>

        <button v-on:click="submitNew">Submit</button>

    </div>
</template>

<script>
import UserService from "../UserService";

export default {
    name: "UserEdit",
    data() {
        return {
            editUsers: this.$route.query.user,
            editStatus: "",
            user: {}
        }
    },
    methods: {
        submitNew() {
            try {
                this.user = UserService.addUsers(this.user);
            } catch (err) {
                this.error = err.message;
            }
            this.cancel();
        }
    },
    watch: {
        $route: "updateRouter"
    }
}
</script>
...