Javascript 将 [object Object] 呈现为字符串数据类型

Posted 2023-02-15

【中文标题】Javascript 将 [object Object] 呈现为字符串数据类型

【英文标题】：Javascript rendering [object Object] as string data type

【发布时间】：2022-01-13 15:19:40

【问题描述】：

我已经尝试解决这个问题一段时间了。这是我的 JS 类：

class Comment 
        constructor(comment) 
            
            this.id = comment.id
            this.comment = comment
        
    
        static createComment(e)
            e.preventDefault()
            const commentMessage = e.target.children[0].value
            const commentList = e.target.previousElementSibling
            
    
            Comment.submitComment(commentMessage, commentList)
            e.target.reset()
        
    
        renderComment(commentList)
            const p = document.createElement('p')
            p.dataset.id = this.id
            p.innerText = "- " + this.comment + " "
        
    
        static submitComment(commentMessage, commentList)
    
            fetch(commentsURL, 
                method: "POST",
                headers: 
                    "Content-Type": "application/json",
                    "Accept": "application/json",
                ,
                body: JSON.stringify(
                    comment: commentMessage
                ),
            )
            .then(response => response.json())
            .then(comment => 
                let newComment = new Comment(comment)
                newComment.renderComment(commentList)
            )
        
        
```

从我的 Rails API 返回以下错误：

"NoMethodError (未定义的方法`permit' for "comment":String):

app/controllers/cmets_controller.rb:24:in comment_params' app/controllers/comments_controller.rb:8:in create'"

这是那个控制器：

class CommentsController < ApplicationController
    def index
        comments = Comment.all
        render json: comments
    end

    def create
        comment = Comment.new(comment_params)
        if comment.save
            render json: comment
        else
            render json: errors: comment.errors.full_messages
        end
    end

    private

    def comment_params
        params.require(:comment).permit(:comment)
    end
end

欢迎任何帮助，如有需要，我会尽量保持清晰。

【问题讨论】：

自己解决了这个问题，只需在我的数据库中添加一个“文本”属性作为字符串类型。就这么简单:)

【参考方案1】：

看起来 ruby​​ 控制器正在尝试对返回字符串执行操作，该操作不是有效的方法。你从哪里得到.permit()？也许在 ruby​​ 论坛上提问？

它返回 [Object object] 的原因是您在获取请求中期望一个 json 对象。您通常只会渲染从 json 对象中的一个值返回的字符串，但在这种情况下，它是一个错误对象。

【参考方案2】：

你用这个发布你的 cmets：

fetch(commentsURL, 
    method: "POST",
    headers: 
        "Content-Type": "application/json",
        "Accept": "application/json",
    ,
    body: JSON.stringify(
        comment: commentMessage
    ),
)

这意味着您将像 "comment": "Comment text goes here..." 这样的 JSON 发送到 Rails。

然后在 Rails 中你尝试用这个解压：

params.require(:comment).permit(:comment)

这就是说“参数必须具有comment 字段，并且在该comment 字段中查找comment 字段”。所以它正在寻找这样的 JSON：

  "comment": 
    "comment": "Comment text goes here.."
  

所以更改您的 JSON 以匹配您的参数解析：

JSON.stringify(
  comment:  comment: commentMessage 
)

或更改您的参数解析以匹配您的 JSON：

params.permit(:comment)

【讨论】：

谢谢。我对 API 进行了一些重构，以减少冗余。但显然错误现在来自前端。它不断返回 [object Object] 而不是字符串。我已经尝试解决它好几天了，我很沮丧。如果您想更深入地了解它，请随时查看整个 repo：github.com/Roeck/TEST1

那么 commentMessage 在 javascript 端到底是什么？

"commentMessage" 是我用来尝试指定字符串数据类型的属性，如果这有意义的话。我刚刚删除了它，它没有任何区别。详细信息：在我的构造函数中，我有“this.comment = comment”，它呈现“[object Object]”。如果我删除这一行，它会呈现“未定义”。如果我使用“this.comment = comment.id”，它显然会返回提交评论的索引号。看来我们已经非常接近解决方案了

但是createComment 调用submitComment 而那只是抓住e.target.children[0].value。那么为什么e.target.children[0].value 是一个 JavaScript 字符串化对象呢？