Reactjs TypeError:无法读取属性'；滚动到视图'；React表中null的定义 常量模态=（{messages}）=>{ const messagesEnd=React.useRef（null）； 常量scrollToBottom=（）=>{ messagesEnd.current.scrollIntoView（{behavior:“smooth”}）； }; useffect（（）=>{ scrollToBottom（）； }, []); const messagesComp=（单个消息）=>{

{单一消息}

} 返回( {messages？messages.map（项，索引=>{ if（messages.length==索引+1）{ 返回消息COMP（项目） }否则{ messagesComp（项目） } } )：null} ); } 我已经做了一个应用程序，如果你点击一个按钮，一个模态弹出，在这个模态上有以表格行形式出现的注释，随着注释的增加，用户必须向下滚动所有的视图，我希望它在模态组件安装时自动滚动。我用过材料界面。

---

我通过ref尝试了它，也尝试了这里可用的其他代码，但仍然显示了此错误。

您的问题是渲染有两个不同的路径，但其中只有一个设置了元素引用：

if（messages.length==索引+1）{
返回消息COMP（项目）
}否则{
messagesComp（项目）
}

甚至还有第三条路径，其中消息为空，您也无法获得引用集

如果没有引用，当调用

useffect

时（无论以何种方式渲染，都会发生），它将不会在

messagesEnd.current

中存储引用

要处理此问题，您需要在渲染中始终具有元素引用（这似乎不是您想要的效果），或者在使用ref之前检查有效性：

constscrolltobttom=（）=>{
if（messagesEnd&&messagesEnd.current）{
messagesEnd.current.scrollIntoView（{behavior:“smooth”}）；
}
};

您需要显示更多代码。什么是

messagesEnd

？为什么您认为该对象上有一个名为

current

的属性？请提供更多信息code@F我已经添加了代码，现在请检查它。它还表明tr中的div是不允许的，所以我做了很多工作，现在我不能替换那些div。有没有其他替代方法，这样我就不会再写上千行代码？@JeremyHarris我看到了“当前”在别人的代码中，即使我删除了当前的，也会出现相同的错误。请检查道具消息是否有任何值。放置一个console.log，如果它返回至少1个null，那么您只需添加一个if条件来仅设置stuff-notnull。

const modal =({messages})=>{

   const messagesEnd = React.useRef(null);

   const scrollToBottom = () => {

        messagesEnd.current.scrollIntoView({ behavior: "smooth" });
    };

   useEffect(() => {

          scrollToBottom();

    }, []); 

    const messagesComp = (single_message)=>{
        <TableRow>
        <div>
        <p>{single_message}</p>
        </div>
        </TableRow>
    }
    return (

        <div>
        <Table>
        <TableBody>
        {messages ? messages.map(item, index => {
            if(messages.length === index+1){
               return  <div ref={messagesEnd}>messagesComp(item)</div>    
            }else{
                messagesComp(item)
            }
        }
        ) : null}
        </TableBody>
        </Table>
        </div>

    );
}