ActionText 正文的值始终为“”空字符串

如何解决ActionText 正文的值始终为“”空字符串

我正在使用 Rails 6 API 和 React。我正在尝试使用 ActionText 构建富文本编辑器。当我从前端的 Trix 编辑器发送 RTE 内容时，它只是没有将 ActionText 正文设置为我通过 Axios 发送的正文。

我确定主体已正确到达控制器，因为我使用了 byebug 并打印了参数值。

例如，它看起来像这样：<div><!--block-->test</div>

但是每当我尝试通过运行 announcement.details.to_s 来查看它的实际情况时，它出于某种原因返回 " "。

我像这样设置 details 字段：has_rich_text :details 在公告模型中。

我处理这个的控制器看起来像这样：

module V1
  class AnnouncementsController < ApplicationController
    def create
      announcement = Announcement.new(announcement_params)
      announcement.author = @current_user

      authorize announcement

      if announcement.valid? && announcement.save
        render json: { message: "Announcement successfully created! You can view it here." },status: 201
      else
        render json: { messages: announcement.errors.full_messages },status: 400
      end
    end

    private

    def announcement_params
      params.require(:announcement).permit(:title,:details)
    end
  end
end

如果有任何帮助，这是 React 代码：

const RTE = (props) => {

    let trixInput = React.createRef()

    useEffect(() => {
        trixInput.current.addEventListener("trix-change",event => {
            console.log("fired")
            props.onChange(event.target.innerHTML)
        })
    },[])

    return (
        <div>
            <input
                type="hidden"
                id="trix"
                value={props.value}
            />
            <trix-editor 
                input="trix"
                data-direct-upload-url={`${bURL}/rails/active_storage/direct_uploads`}
                data-blob-url-template={`${bURL}/rails/active_storage/blobs/:signed_id/*filename`}        
                ref={trixInput}
                className="trix-content"        
            ></trix-editor>            
        </div>
    );
}

然后我通常只是用 Axios 传递它：

        axios.post(`${bURL}/v1/announcements/create`,{
            "announcement": {
                "title": title,"details": value
            }
        },{
            headers: {
                'Authorization': `token goes here`
            }
        }).then(res => {
            // success
        }).catch(err => {
            // error
        })

如果您需要更多代码片段或信息，请发表评论。