我遇到了这个带有React-Native聊天应用程序的SendBird,我正在研究它的代码结构。以下代码行使我感到困惑:
Function.js
export const sbAdjustMessageList = (list) => {
return list.map((message, i) => {
message['time'] = sbUnixTimestampToDate(message.createdAt);
message['readCount'] = 0;
if (message.isUserMessage() || message.isFileMessage()) {
message['isUser'] = (message.sender.userId === SendBird.getInstance().getCurrentUserId());
} else {
message['isUser'] = false;
}
if (message.sender) {
message.sender['isShow'] = true;
if(!message.sender.profileUrl) {
message.sender.profileUrl = 'default-image';
}
}
if (i < list.length - 1) {
let prevMessage = list[i + 1];
if (message.isUserMessage() || message.isFileMessage()) {
if (prevMessage.isUserMessage() || prevMessage.isFileMessage()) {
if (prevMessage.sender.userId === message.sender.userId) {
message.sender.isShow = false;
}
}
}
}
return message
});
}
Main.js
_renderFileMessageItem = rowData => {
const message = rowData.item;
if (message.isUserMessage()) {
return <TextItem isUser={message.isUser} message={message.message} />;
} else if (sbIsImageMessage(message)) {
return <ImageItem isUser={message.isUser} message={message.url.replace("http://", "https://")} />;
} else {
return <FileItem isUser={message.isUser} message={message.name} />;
}
};
在Function.js中,
message['isUser']
的声明是该声明,然后将其导出到Main.js中以供使用。但是在Main.js中,isUser
成为导入组件的道具。此外,构造函数类中没有isUser
的初始化。我的问题是
message['isUser']
在这里是什么意思?它是JavaScript还是redux功能(示例应用程序使用redux和react-redux)?谢谢!
最佳答案
因此,使用给定的代码,可以推断出函数sbAdjustMessageList
获取一个列表,即消息的array
并格式化其中的所有消息并返回array of formatted messages
,而isUser
是每个消息中的键信息。
但是在Main.js中,_renderFileMessageItem
是ListView
的一种项目渲染器,每个项目渲染都会收到一条消息。很明显,rowData的内部有一个消息项,该消息是sbAdjustMessageList
函数返回的数组中的消息之一(因为此数组必须已提供给ListView)。
由于isUser
是TextItem的道具,其JSX
不需要在构造时为组件提供道具声明。尽管编写质量代码并使用PropTypes
声明所有道具和类型总是更好的做法message['isUser']
只是javascript
操纵对象属性的方式。
希望这可以帮助。快乐编码:)