React-chat-element聊天组件中renderAddCmp的使用

React-chat-element聊天组件中renderAddCmp的使用
学习前端一个月了,本次使用react-chat-element+ant design做了聊天项目,无奈react-chat-element中messagebox中只有photo,file,text,location,spotify这5中类型,而我要做的是解析安卓发来的视频和语音片段,react-chat-element中没有这语音视频片段类型,我想到的方法是要么改源码,增加类型.要么采用自定义组件renderAddCmp.改源码可能对于我这个初学者来说比较费事,所以我选择了第二种.自定义组价.

一.没有轮子,自己造
自定义语音解析组件voiceplay和videoplay.下面是语音代码
下面展示一些 内联代码片。

render(){
   
    return(
        <div id ="video-container-mbox">
        <div className="video-mbox video-mbox-right video-mbox--clear-notch">
            <div className="video-mbox-body"