在我的React项目。我需要在前端发布的数据有4个值。两个值是输入类型，没有问题，在存储，下一个值是从本地存储userID派生的变量，在用户我采取的用户名和存储在setusername。但发布后，除了用户名的数据所有值存储。现在我需要存储在它的用户名。和图像也不存储在数据库中
后图式

const postSchema = new mongoose.Schema({
  user: { type: String,ref: 'Users'},
  title: {type: String,required: true},
  description: {type: String,required: true },
  image: {type: String },
  likes: [{type: mongoose.Schema.Types.ObjectId,ref: 'Users' }],
  comments: [
    {
      user: {type: mongoose.Schema.Types.ObjectId,ref: 'Users',required: true},
      text: {type: String,required: true},
      createdAt: { type: Date, default: Date.now}
    }
  ],
  createdAt: { type: Date,default: Date.now}
});

邮路

router.post('/', async (req, res) => {
  try {
    const { title, description, image, username } = req.body;

    const post = new PostModel({
      user: username,
      title,
      description,
      image
    });

    const savedPost = await post.save();
    res.json(savedPost);
  } catch (err) {
    res.status(400).json({ error: 'Failed to create post' });
  }
});

这是文章页

const [title, setTitle] = useState('');
  const [description, setDescription] = useState('');
  const userID = localStorage.getItem('userID');
  const [username, setUsername] = useState({});
  const [image, setImage] = useState(null);

  useEffect(() => {
    const fetchUserInfo = async () => {
      try {
        const response = await axios.get(`http://localhost:3001/auth/${userID}`);
        const user = response.data;
        setUsername(user.username);
      } catch (error) {
        console.error('Error fetching user information:', error);
      }
    };

    fetchUserInfo();
  }, [userID]);

  const handleSubmit = async (event) => {
    event.preventDefault();

    try {
      await axios.post('http://localhost:3001/posts', {
        user: username,
        title,
        description,
        image
      });
      setTitle('');
      setDescription('');

      console.log('Post submitted successfully!');
    } catch (error) {
      console.error('Error submitting post:', error);
    }
  };
 const handleImageChange = (event) => {
    const selectedImage = event.target.files[0];
    setImage(selectedImage);
  };
 return (
    <div>
      <h1>Post Your Recipe</h1>
      <form onSubmit={handleSubmit}>
        <label htmlFor="title">Title:</label>
        <input
          type="text"
          id="title"
          value={title}
          onChange={(event) => setTitle(event.target.value)}
        />

        <label htmlFor="description">Description:</label>
        <textarea
          id="description"
          value={description}
          onChange={(event) => setDescription(event.target.value)}
        ></textarea>
         <label htmlFor="image">Image:</label>
        <input type="file" id="image" onChange={handleImageChange} />
        <button type="submit">Submit</button>
      </form>
    </div>
  );

用户名是在用户.用户名我需要存储这以及一起所有.在路由用户中：用户名如何存储在其中。图像和用户此字段未存储在数据库中。