React，如何動態地將引導徽章添加到DOM？

我正在使用套接字聊天應用，&嘗試向用戶顯示通知給他/她收到私人消息。React，如何動態地將引導徽章添加到DOM？

這樣的：裏面

<a class="list-group-item list-group-item-action" data-socketid="kiBkagnVmM7Y9COeAAAH"> 
</a>

我試圖追加：

<span class="badge badge-danger badge-pill float-right ">4</span>

所以，我得到：

我試圖避免使用jQuery但如果我用它做：

.innerHTML += '<span className="badge badge-danger badge-pill float-right ">4</span>'

引導類不拾取，不顯示樣式。

陣營代碼：

請幫✌️

感謝。

來源

2017-10-18 Vishal

你可以發佈您的某些組件的代碼？特別是你正在做的添加'span'的地方以及你要添加它的邏輯 – palsrealm

@prealrealm你好，我添加了上面的代碼，非常感謝你的時間。 – Vishal

好吧我終於明白，原因css類沒有顯示任何樣式是：React controls \創建一個虛擬的dom，並且可以直接訪問這些元素。

正確的方法是手動創建元素和追加：

let badge = document.createElement('span'); 
      badge.className = 'badge badge-danger badge-pill float-right'; 
      badge.innerHTML = '+' 
      selectUserId[0].appendChild(badge);

來源

2017-10-18 18:58:33 Vishal

React，如何動態地將引導徽章添加到DOM？

回答

相關問題