Ruby 和 React 新手，遇到问题

Question

我对 ruby 完全陌生，并且已经研究了这个错误几个小时但无济于事。问题出在哪里，或者我怎样才能更好地理解它并自己找到它？我主要尝试过重命名，但我愿意接受任何和所有建议。

错误：

ActionController::RoutingError (uninitialized constant Api

      Object.const_get(camel_cased_word)
            ^^^^^^^^^^

            raise MissingController.new(error.message, error.name)
            ^^^^^):

路线.rb：

Rails.application.routes.draw do
  get 'welcome/index'

  namespace :api, defaults: { format: 'json' } do
    namespace :v1 do
      resources :guests, only: %i[create]
    end
  end

  root 'welcome#index'
end

guests_controller.rb：

class Api::V1::GuestsController < Api::V1::BaseController
  def create
    @guest = Guest.new(guest_params)
    if @guest.save
      render json: { message: 'Success! Welcome, ' + @guest.full_name }, status: :created
    else
      render json: { errors: @guest.errors }, status: :bad_request
    end
  end

  private

  def guest_params
    params.require(:guest).permit(:full_name, :phone_number)
  end
end

Guest.js：

import React, { useState } from 'react';
import axios from 'axios';

const Guest = () => {
  const [fullName, setFullName] = useState('');
  const [phoneNumber, setPhoneNumber] = useState('');
  const [fullNameError, setFullNameError] = useState('');
  const [phoneNumberError, setPhoneNumberError] = useState('');

  const handleSubmit = (e) => {
    e.preventDefault();

    const validPhoneNumberRegex = /^\d{10,11}$/;

    if (fullName.trim().split(' ').length !== 2) {
      setFullNameError('*must be your first and last name');
    } else {
      setFullNameError('');
    }

    if (!validPhoneNumberRegex.test(phoneNumber)) {
      setPhoneNumberError('*must be numbers only (ex. 1231231234)');
    } else {
      setPhoneNumberError('');
    }

    if (fullName.trim().split(' ').length == 2 && validPhoneNumberRegex.test(phoneNumber)) {
      alert(`Success! Welcome, ${fullName}.`);
      axios.post('http://localhost:3000/api/v1/guests', {
        full_name: fullName,
        phone_number: phoneNumber
      })
        .then((response) => {
          alert(response.data.message);
        })
        .catch((error) => {
          console.error(error);
        });
    }
  };

  const handleChange = (e) => {
    const { name, value } = e.target;
    if (name === 'fullName') {
      setFullName(value);
    } else if (name === 'phoneNumber') {
      setPhoneNumber(value);
    }
  };

  return (
    <div className="guest">
      <h1 className="guest__title">Welcome</h1>
      <p className="guest__subtitle">
        Please provide your full name and phone number.
      </p>
      <form onSubmit={handleSubmit}>
        <div>
          <label htmlFor="fullName">Full Name:</label>
          <input
            type="text"
            id="fullName"
            name="fullName"
            className={`${fullNameError ? 'error' : ''}`}
            value={fullName}
            onChange={handleChange}
            placeholder="Please enter your full name"
          />
          {fullNameError && (
            <div className="error-message">{fullNameError}</div>
          )}
        </div>
        <div>
          <label htmlFor="phoneNumber">Phone Number:</label>
          <input
            type="text"
            id="phoneNumber"
            name="phoneNumber"
            className={`${phoneNumberError ? 'error' : ''}`}
            value={phoneNumber}
            onChange={handleChange}
            placeholder="Your Phone Number"
          />
          {phoneNumberError && (
            <div className="error-message">{phoneNumberError}</div>
          )}
        </div>
        <button type="submit">View Menu</button>
      </form>
    </div>
  );
};

export default Guest;

尝试创建我的第一个帖子请求，但不起作用。

Answer 1

使用显式模块嵌套而不是滥用范围解析运算符。

# bad
class Api::V1::GuestsController < Api::V1::BaseController
  # ...
end

# good
module Api
  module V1
    class GuestsController < BaseController
      # ...
    end
  end
end

虽然这看起来像是风格上的挑剔，但我向你保证事实并非如此。

module Api

重新打开模块或定义它（如果不存在）。

class Api::V1::GuestsController

不会，如果模块尚未加载，则会导致您遇到的错误。

module Api

还正确设置了模块嵌套，以便我们可以在没有

Api::V1::BaseController

的情况下引用同一命名空间中的其他常量。嵌套在

Api::V1::GuestsController

内部的模块将正确地为

[Api::V1::GuestsController, Api::V1, Api]

，这就是 Ruby 将在进入 main 之前查找常量。

滥用范围结果运算符反而会导致模块嵌套

[Api::V1::GuestsController]

以及令人惊讶的持续查找和自动加载错误。

对于额外的风格点，请添加

API

的变形，因为它是首字母缩略词，首字母缩略词应大写。

# config/initializers/inflections.rb
ActiveSupport::Inflector.inflections(:en) do |inflect|
  inflect.acronym "API"
end

# better
module API
  module V1
    class GuestsController < BaseController
      # ...
    end
  end
end