最近TSINGSEE青犀視訊團隊對新版EasyNTS的更新改版已經完成的差不多了，期間我們把推流閘道器的功能融合進了EasyNTS中，實現了EasyNTS埠穿透+視訊推流功能的一機兩用，但是兩種功能的操作方式不同，大家要區分開來。

EasyNTS視訊拉轉推實現流程：

EasyNTS網路穿透實現流程：

雖然大體上已經修復完畢，但還有一些細微的內容，在我們發現問題的時候，就會及時進行調整。最近我們就發現EasyNTS搜尋框圖示的盒子高度超出了搜素框的整體高度，導致搜尋框很不協調，因此修復了這個錯位。

應該圖示的樣式有問題，導致圖示高度高於整體搜素框的高度。

先給整體搜尋框加個獨有的類名例如：search_contanter ，然後在此類名下寫相應的樣式，這是為了防止樣式衝突，參考程式碼如下：

         <div class="input-group search_contanter">
              <input
                type="text"
                class="form-control"
                placeholder="輸入搜尋內容"
                v-model.trim="query"
                @keydown.enter.prevent="doSearch"
              />
              <div class="input-group-btn">
                <button
                  type="button"
                  class="btn btn-default"
                  @click.prevent="doSearch"
                >
                  <i class="iconfont iconjiansuo"></i>
                </button>
              </div>
            </div>
 

.search_contanter {
    height: 36px;
    input {
        height: 36px;
        width: 100%;
    }
    .btn-default {
        height: 36px;
        &:hover {
            border-color: #ddd;  
        }
    }
}

調整之後搜尋框恢復正常。

EasyNTS在功能融合之後，大家反應都是比之前的兩套裝置部署更加便捷了，所以如果是有網路穿透和視訊流拉轉推雙重需求的使用者，還是建議嘗試一下該方案，更多視訊相關內容，也歡迎大家和我們瞭解諮詢。