我正在使用基于地图的应用程序,该应用程序使用Google Map API在React.js中创建标记及其信息窗口。 infowindow.setContent()
只接受String
或HTML
。我不可能通过String
,因为我有一个button
链接到另一个反应组件中的特定方法(如:_this.props.addList(place)
)。因此,我必须填写的参数作为HTML DOM为下面的代码行:React.js:是否可以将反应组件转换为HTML DOM?
var div = document.createElement('div');
var title = document.createElement('h4');
title.innerHTML = place.name;
var btn = document.createElement('button');
btn.className = 'btn btn-danger btn-block';
btn.appendChild(document.createTextNode('I want to go here !!'));
div.appendChild(title).appendChild(btn);
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(div);
infowindow.open(map, this);
});
btn.addEventListener('click', function() {
_this.props.addList(place);
});
的代码为我工作,但一个我不想创建元素之一。我也试图通过与阵营成分的说法,但似乎不工作:
所以是有另一种方式来至少转换反应成分为HTML,让我不要不必一一写下document.createElement()
?
感谢
我收到以下错误:“未捕获的错误:不变冲突:React.render():无效的组件元素。”当应用您的解决方案 –
得到了解决方案,对不起。这是因为代码在创建元素之前运行React.remder()。这里是解决方案:var div = document.createElement('div'); \t \t \t的setInterval(函数(){ \t \t \t \t如果(DIV) \t \t \t \t \t clearInterval(); \t \t \t},5); \t \t \t React.render(_this._renderInfoWindow(place),div); –
不会'_this'出现在没有'var'的全局范围之前吗?这是打算吗? – wprl