在不编辑基本代码的情况下更改引导程序选择的HTML模板

Question

我需要更改引导选择插件（thdoan-bootstrap-select-v1.6.4-30-g9e3861b）的搜索框的HTML结构。

我看了看库的源代码，看起来是这样的：

import { Component } from 'react'
import { withRouter } from 'next/router'
import MyComponent from '~/modules/my-component'
import Router from 'next/router'


class Logs extends Component {
  componentWillUpdate(props){
    //does not get printed
    console.log("================componentWillUpdate", this.props.router.query)
  }
  componentWillReceiveProps(props){
    //does not get printed
    console.log("================componentWillReceiveProps", this.props.router.query)
  }
  render(){
    return (
      <div>
        <div>My Logs page</div>
        <MyComponent />
      </div>
    )
  }
}
export default withRouter(Logs)

例如，我想向其中添加更多元素：

          searchbox = this.options.liveSearch ?
        '<div class="bs-searchbox">' +
          '<input type="text" class="form-control" autocomplete="off"' + (null===this.options.liveSearchPlaceholder ? '' : ' placeholder="' + htmlEscape(this.options.liveSearchPlaceholder) + '"') + '>' +
        '</div>' : ''

我可以通过编辑库直接更改它，但是我知道这不是一个好习惯。

是否可以更改输出HTML的格式？

这是我初始化插件的方式：

       searchbox = this.options.liveSearch ?
        '<div class="search-box-outer"><div class="bs-searchbox">' +
          '<input type="text" class="form-control" autocomplete="off"' + (null===this.options.liveSearchPlaceholder ? '' : ' placeholder="' + htmlEscape(this.options.liveSearchPlaceholder) + '"') + '><div class="icon-search"></div>' +
        '</div></div>' : ''