uni-app动态为导航栏中的搜索框设置文本

在uni-app中为页面配置输入框的方法

{
  "path": "pages/search-list/search-list",
  "style": {
    "navigationBarTitleText": "搜索",
    "navigationBarBackgroundColor": "#fff",
    "app-plus": {
      "scrollIndicator": "none",
      "titleNView": {
        "searchInput": {
          "placeholder": "请输入内容",
          "disabled": true,
          "align": "left",
          "borderRadius": "15px",
          "backgroundColor": "#F7F7F7",
          "placeholderColor": "#B3B3B3"
        },
        "buttons": [
          {
            "float": "right",
            "color": "#636263",
            "text": "筛选",
            "fontSize": "16px",
            "width": "44px"
          }
        ]
      }
    }
  }
}

上面的json配置默认是固定的，如果想将搜索的结果动态传递到搜索框中显示

如下：

传递参数进行路由跳转

uni.navigateTo({
  url: `../search-list/search-list?keyword=${temp}`
})

在onLoad中接收参数并将数据动态设置到搜索框中

onLoad({ keyword }) {
  // #ifdef APP-PLUS
  let webView = this.mp.page.getAppWebview()
  webView.setTitleNViewSearchInputText(keyword)
  // #endif
  // #ifdef H5
  let inputSearch = document.querySelector('.uni-input-input[type=search]')
  var evt = new InputEvent('input', {
    inputType: 'insertText',
    data: keyword,
    dataTransfer: null,
    isComposing: false
  })
  if (inputSearch) {
    inputSearch.value = keyword
    inputSearch.dispatchEvent(evt)
  }
  // #endif
}