起因:
使用 vant-weapp 的 Dialog 彈出框組件,點擊了 'confirm' 按鈕後,如果報錯,按鈕一直處於 '加載狀態'。
查看官方文檔(非常仔細的看了下...),Dialog 組件支持 2 種方式的調用:
1>函數調用
2>組件調用
而關於 'confirm' 按鈕的 loading 狀態,文檔中提及了 'Dialog.stopLoading() - 停止按鈕的加載狀態。
但是使用 '組件調用' 並沒說解決方法
後到官方 issues 查看:
https://github.com/youzan/vant-weapp/issues?utf8=%E2%9C%93&q=dialog+%E7%BB%84%E4%BB%B6stopLoading
提到了可以通過:
this.selectComponent('#id') 來獲取 Dialog 組件實例,然後再執行 stopLoading() 即可
最終就是:
this.selectComponent('#id').stopLoading()
開始解決:
頁面中使用 this.selectComponent('#id'),一直報錯:
this.selectComponent is not a function
查看小程序官方文檔,關於 selectComponent:
https://developers.weixin.qq.com/miniprogram/dev/reference/api/Component.html
在自定義組件中,可以獲取內部的自定義組件實例:
selectComponent - 使用選擇器選擇組件實例節點,返回匹配到的第一個組件實例對象(會被 wx://component-export 影響)
selectAllComponents - 使用選擇器選擇組件實例節點,返回匹配到的全部組件實例對象組成的數組
想着我是不是因爲是在 page(頁面) 中使用的問題,各種搜索,好像有的說可以、有的不可以,然後開始在社區提問:
https://developers.weixin.qq.com/community/develop/doc/000e02ed5307c0cdfcc8501975b400?jumpto=qcomment&commentid=00064c6b7f8520bef4c89c8025b0
後自己測試,發現原生小程序的 page(頁面) 中可以使用 this.selectComponent('#id')
考慮是不是 wepy 框架問題,再進入 wepy 官方 issues 搜索問題:
https://github.com/Tencent/wepy/issues?utf8=%E2%9C%93&q=selectComponent
找到最終解決方案:
this.$wxpage.selectComponent()
總結:
獲取組件實例:
原生小程序:
this.selectComponent('#id')
wepy 框架:
this.$wxpage.selectComponent()
mpvue 框架:
self.$mp.page.selectComponent("#submitCaseDialog").stopLoading()
也記錄下(未使用過 mpvue 框架):
https://github.com/Meituan-Dianping/mpvue/issues/605