[英]Passing data into a React component from the HTML page?
我有一个这样的 React 应用程序:
索引.html:
<div class="asset_infos" data-keyID="msg_1"></div>
<div class="asset_infos" data-keyID="msg_2"></div>
...
<div class="asset_infos" data-keyID="msg_n"></div>
和 index.js:
var Msg = props => (
<div>It is { props.keyID }</div>
);
document.querySelectorAll('.asset_infos')
.forEach(domContainer => {
ReactDOM.render(<Msg {...(domContainer.dataset)} />,
domContainer
);
});
我希望将每个 < div > 的 data-keyID 属性中的数据传输到 Msg 变量并进行显示,但事实并非如此。 你知道怎么做吗?
你可以像下面这样传递道具。 请参阅演示https://jsfiddle.net/uveh5d48/1/
document.querySelectorAll('.asset_infos')
.forEach(domContainer => {
ReactDOM.render(<Msg keyID = {domContainer.dataset.keyid} />,
domContainer
);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.