gpt4 book ai didi

javascript - 如何在react-native中显示(二维)字符串数组

转载 作者:行者123 更新时间:2023-12-02 23:18:27 26 4
gpt4 key购买 nike

我试图在我的 react native 代码中显示一个二维字符串数组,该数组是从 native 代码传递的。传递代码不是问题,但是我真的不知道如何正确显示这个数组。出于测试目的,我在 js 代码中将消息数组设置为常量。

这是我的数组:

const messageArray = [
["msg1", "date1"],
["msg2", "date2"],
["msg3", "date3"],
["msg4", "date4"],
["msg5", "date5"]
];

如何将其渲染到 View 中?

最佳答案

以下是如何执行此操作的示例。您可以使用解构

const messageArray = [
["msg1", "date1"],
["msg2", "date2"],
["msg3", "date3"],
["msg4", "date4"],
["msg5", "date5"]
];

class App extends React.Component {
render() {
return (
<div>
{messageArray && messageArray.map(([message, date]) =>
<div className='msg-item'>
message: {message || ''}
<br />
date: {date || ''}
</div>
)}
</div>
);
}
}

// Render it
ReactDOM.render(
<App />,
document.getElementById("react")
);
.msg-item {
border: 1px solid black;
}

.msg-item + .msg-item {
margin-top: 1rem;
}
<div id="react"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

关于javascript - 如何在react-native中显示(二维)字符串数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57053963/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com