TypeError: comments.map不是React中的函数
这个错误信息是由于在React中使用了一个不是函数的变量comments.map。map是一个数组方法，用于对数组中的每个元素进行操作并返回一个新的数组。根据错误信息，comments可能不是一个数组或者不是一个可迭代的对象。
要解决这个错误，可以按照以下步骤进行排查和修复：
- 确保
comments是一个数组或者可迭代的对象。可以使用console.log(comments)来打印comments的值，检查其类型和内容。 - 如果
comments不是一个数组，可以尝试将其转换为数组。可以使用Array.from(comments)或者扩展运算符[...comments]来将其转换为数组。 - 如果
comments是一个空值（null或undefined），可以在使用map方法之前进行空值检查，避免出现错误。可以使用条件语句如if (comments) { /* 使用map方法 */ }来确保comments有值再进行操作。 - 如果以上步骤都没有解决问题，可以检查
comments的来源，确保其在使用之前已经正确地被赋值。
关于React中的错误处理和调试，可以参考腾讯云的React开发文档：React开发文档。
请注意，以上答案仅供参考，具体解决方法可能因具体情况而异。
相关·内容
3回答
TypeError: comments.map不是函数
javascript、reactjs、react-hooks
我正在研究react并试图学习，但当我单击send按钮时遇到了这个错误：：
TypeError: comments.map不是函数
import React, { useState } from 'react';
function App() {
const [comments, setComments] = useState(['Comment1', 'Comment 2', 'Etc'])
const sendComment = () => {
setComments({
[commen
浏览 16提问于2020-05-26得票数 0
回答已采纳
1回答
破坏图像图标和TypeError: comments.map不是一个函数
javascript、reactjs
这是我的代码，它有两个问题。首先是下面的代码中的图像没有显示，并由破碎的图像图标显示，第二个是TypeError: comments.map不是一个函数，这个错误。
import React from 'react';
function RenderComments(comments){
if (comments != null)
return(
console.log(comments),
<div className="col-12 col-md-5 m
浏览 2提问于2020-07-26得票数 0
回答已采纳
1回答
为什么下面的代码会为我产生不同的输出？
<% @comments.each do |comment| %>
<%= comment.title %>
<% end %>
产生：
Title 1 title 2
但
<%= @comments.each { |comment| comment.title } %>
产生：
[#<Comment id: 1, commentable_id: 1, commentable_type: "Entry", title: "Title 1", body: "b
浏览 0提问于2012-08-06得票数 1
回答已采纳
3回答
read :无法读取传递道具上未定义的属性“映射”
javascript、reactjs
从post组件获取注释数组并将其传递给comments组件之后，日志开始在下面的屏幕截图中显示错误
组件是：
import React, { Component } from "react";
import axios from "axios";
import Comments from "../components/comments";
class Article extends Component {
constructor(props) {
super(props);
浏览 1提问于2018-10-14得票数 3
回答已采纳
2回答
React中的迭代器react/jsx-key中的元素缺少"key“属性
javascript、html、css、reactjs、jsx
我是React的新手，当我在迭代器react/jsx- <button onClick={addComment} className='add-btn'>+</button>中为元素按下缺少"key“属性时，我试图清除输入 import React, { useContext, useState } from 'react';
import ContentHeader from './PatientHeader';
import { PatientContext } from '../App';
浏览 94提问于2021-07-16得票数 0
2回答
如何使用map函数打印子数组的项
javascript、html、reactjs、database、dictionary
这是我试图通过map函数打印注释的代码，但不知道如何打印：
class Postcomment2 extends React.Component {
uploadcomment = () => {
return this.props.post.comments.map((commentz) => {
return <div>{this.props.post.comments["comment"]}</div>;
}); /* How to access sub array of comments and print them
浏览 14提问于2022-09-24得票数 -1
回答已采纳
1回答
MongoDB中的未决承诺
javascript、node.js、mongodb、mongoose
let comments = await Comment.find({ post })
.populate({ path: "user", select: "name photoURL role page" })
.sort({ createdAt: -1 });
console.log("comments --", comments);
const pages = [];
let pagesData = comments.map(async (comment) => {
let
浏览 3提问于2021-07-03得票数 2
回答已采纳
1回答
映射关联数组的值。
javascript、reactjs、immutable.js
我有以下regex组件：
const CommentBox = React.createClass({
render: function() {
return (
<div className="commentBox">
<h1>Comments</h1>
<CommentList comments={this.props.comments}/>
<CommentForm />
</div>
);
}
});
浏览 2提问于2016-08-30得票数 0
回答已采纳
1回答
我在React中的自定义钩子有什么问题？
reactjs、frontend、single-page-application
嗨，堆栈溢出社区！ 我正在学习react，现在我正在练习自定义钩子。我从这里获得示例数据：https://jsonplaceholder.typicode.com/posts 我有两个组件。 App.js import React from "react";
import useComments from "./hooks/useComments"
const App = () => {
const Comments = useComments();
const renderedItems = Comments.map((comment)
浏览 4提问于2021-01-09得票数 0
回答已采纳
3回答
返回React组件索引中的第一项
javascript、reactjs、typescript、react-native
更新为澄清问题:我在这里尝试做的是，对于索引===为0的每个实例，我希望有条件地将黑色类(recentTitleClass)应用于排版文本。我通过props将两个css类previousTitleClass和recentTitleClass传递到组件中。现在，我只想recentTitleClass仅用于数组的第一个实例。如果添加了新的注释/标题，则此数组会发生变化，因此标签为previousTitleClass & recentTitleClass。 这是我到目前为止所拥有的。 interface IProps {
comments?: List<Map<
浏览 6提问于2019-01-06得票数 0
回答已采纳
1回答
React Array.map不将JSON数据识别为数组
arrays、json、reactjs、react-redux
这可能是一个非常简单的修复，但我还没有弄清楚为什么map函数不能将输入识别为数组。
我有一个两难模型，其中包含一个用户评论数组。我获取数据并将其映射到react组件的状态。然后，我尝试将数据作为道具解析到子组件，在该组件中，我试图映射数据。
减速器
const initialState = {
loading: false,
dilemma: {}
};
export default function(state = initialState, action) {
switch (action.type) {
case GET_DILEMMA:
return
浏览 0提问于2018-08-28得票数 0
2回答
如何在ReactJs中使用useState内部的映射初始化数据？
reactjs、react-hooks、ag-grid、use-state、ag-grid-react
我刚开始反应，在我正在做的作业中，我必须在AG Grid表中显示数据。为此，我是如何在rowData中初始化useState()的，但是它没有显示在网页中。表是空的，只有列名。
const CommentTable: React.FC<CommentProps> = (props) => {
const { comments } = props;//comments is an array of an object named Comment.
const [rowData] = useState(comments.map(comment => {
浏览 3提问于2022-02-15得票数 1
回答已采纳
2回答
怎么打电话通知redux-thunk的调度？
reactjs、react-redux、redux-thunk
我有以下行动
export const fetchCommentRequest = () => {
return {
type: FETCH_COMMENTS_REQUEST,
};
};
export const fetchComments = () => {
return (dispatch) => {
dispatch(fetchCommentRequest());
fetch("https://jsonplaceholder.typicode.com/comments")
.then((res) =&g
浏览 2提问于2021-05-22得票数 1
1回答
使用setState更新支柱后未更新的prop组件
javascript、reactjs
我目前正在尝试创建一个交互式评论部分，允许用户评论、回复和喜欢/不喜欢他人的评论。由于无法在组件中更新“喜欢”的值，所以当前我一直停留在“喜欢”/“向上投票”部分。
下面是我的Comment组件(它表示注释部分中的一个注释)：
import { useState } from "react";
const Comment = ({
upvotes,
image,
username,
isUser,
replies,
createdAt,
id,
upvoteMethod,
}) => {
const [score, setScore]
浏览 3提问于2022-05-07得票数 1
回答已采纳
2回答
React选择器会返回jsx吗？
reactjs
当我编写我的React应用程序时，我将所有的状态、支持计算放在不同的函数中。我称它们为选择器，但我不确定它们是否是选择器。根据定义，选择器是返回状态或道具子集的函数。关于这个问题，我有几个问题：
1)选择器能返回jsx对象吗？
例如，我希望将<Item />填充到另一个组件中。
selectorItem = (state, props) => {
const { items } = props;
const ItemsJSX = items.map((item) => {
return (
<Item
浏览 3提问于2017-08-22得票数 1
6回答
数组从整数: 143 -> [1，4，3]
javascript、arrays
从一个数字中创建一个由数字组成的数组的最短方法是什么？
我不想恢复到声明一个空数组，然后通过for(a,b,c)循环迭代这个数字。
我想要一些更说明性的东西。理想的情况是：
Array.from(143) // => [1, 4, 3]
浏览 0提问于2018-08-02得票数 1
回答已采纳
3回答
为什么指定道具的对象的属性无效？
reactjs、jsx
我已经找到了一个幸运的解决方案，所以我不太明白它是如何工作的，即使在尝试阅读网上的东西。
我只是想得到selectedDish道具中的评论数组。selectedDish的状态在主组件的函数中填充，我正在尝试访问selectedDish在DishDetail组件中的注释数组。
我得到了以下评论：
{ this.props.selectedDish && this.renderComments(this.props.selectedDish.comments)}
但是，当我只执行以下操作并收到此错误时，我无法读取未定义的属性‘注释’：
{ this.renderComments(t
浏览 3提问于2019-12-04得票数 1
回答已采纳
1回答
域名解析配置完成后，如何解决通过域名无法访问自己的服务器的问题？
DNS 解析 DNSPod、dns、tcp/ip
昨天可以访问，然后又不行了，初步怀疑是解析出了问题。如何解决呢？域名指向的是自己的公网ip地址，通过公网ip能访问自己的服务器。所以问题是在解析这边。如何解决呢
浏览 646提问于2020-11-10
2回答
‘！current_user`的正确语法是什么？
ruby-on-rails、syntax
我在此写这一声明：
where :commentable_id => comments.map(&:id), :user_id => !current_user
问题是它只返回一个id为0的用户。假设这是一个非用户，或者更确切地说是一个！用户。
在这种情况下，我只想说任何人，除了当前的用户。
你会怎么写？
使用"not #{current_user.id}返回：
SELECT "comments".* FROM "comments" WHERE ("comments"."user_id" = 0)
浏览 2提问于2010-12-13得票数 0
回答已采纳
6回答
must / codelyzer / ng lint错误："for (. in .)语句必须使用if语句过滤“
angular、angular2-forms、angular-cli、tslint
衣领错误信息：
src/app/detail/Edit.Component.ts 111，5: for (..)语句必须使用if语句进行筛选。
代码片段(这是一个工作代码。也可在上获得)：
for (const field in this.formErrors) {
// clear previous error message (if any)
this.formErrors[field] = '';
const control = form.get(field);
if (control && con
浏览 6提问于2016-11-23得票数 286
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
