this.selectComponent is not a function

傷城~ 2022-05-13 10:56 729阅读 1赞

微信小程序开发时报错，具体错误内容如下：

VM26227:1 thirdScriptError
this.selectComponent is not a function;at pages/test/test page lifeCycleMethod onReady function
TypeError: this.selectComponent is not a function
at e.onReady (http://127.0.0.1:61588/appservice/pages/test/test.js:21:24)
at e. (dev/WAService.js:17:25368”>http://127.0.0.1:61588/appservice/**dev**/WAService.js:17:25368)
at J (dev/WAService.js:17:14633”>http://127.0.0.1:61588/appservice/**dev**/WAService.js:17:14633)
at Function. (dev/WAService.js:17:16796”>http://127.0.0.1:61588/appservice/**dev**/WAService.js:17:16796)
at dev/WAService.js:17:22296”>http://127.0.0.1:61588/appservice/**dev**/WAService.js:17:22296
at dev/WAService.js:6:26411”>http://127.0.0.1:61588/appservice/**dev**/WAService.js:6:26411
at e.(anonymous function) (dev/WAService.js:4:4737”>http://127.0.0.1:61588/appservice/**dev**/WAService.js:4:4737)
at a (http://127.0.0.1:61588/appservice/appservice:1092:9451)
at e.registerCallback (http://127.0.0.1:61588/appservice/appservice:1092:9638)
at m.forEach (http://127.0.0.1:61588/appservice/appservice:1092:5612)
console.error @ VM26227:1
errorReport @ WAService.js:3
thirdErrorReport @ WAService.js:3
(anonymous) @ WAService.js:3
(anonymous) @ WAService.js:17
J @ WAService.js:17
(anonymous) @ WAService.js:17
(anonymous) @ WAService.js:17
(anonymous) @ WAService.js:6
e.(anonymous function) @ WAService.js:4
a @ appservice:1092
e.registerCallback @ appservice:1092
m.forEach @ appservice:1092
d @ appservice:1092
j.onmessage @ appservice:1092

这里写图片描述

使用场景：微信小程序开发，调用自定义组件时，报错
错误原因：不了解微信自定义组件调用方法导致，调用界面的json中未正确配置自定义组件
以下记录使用自定义组件详情
1.项目目录结构如下，自定义组件放到了 项目名称/pages/components 此目录下，你可以自己定义你放置自定义组件目录的名称，此目录下 dialog目录及pwddialog目录是自定义了两个对话框组件，分别下目录 项目名称/pages/index 与目录 项目名称/pages/test 中调用自定义组件
这里写图片描述

2.在目录 项目名称/app.json 中配置如下：

  1. {
  2.   "pages":[ "pages/test/test", "pages/index/index" ],
  3.   "window":{ "backgroundTextStyle":"light", "navigationBarBackgroundColor": "#37363C", "navigationBarTitleText": "test", "navigationBarTextStyle":"white" } }

3.重点1，自定义组件，在小程序框架中，每个界面的目录结构是这样的，大家并不陌生，注意了自定义组件的wxml，js，wxss这个就是常规的html，js，css的变体，大同小异，这里要说一下json中的配置，此自定义组件下的每个组件的json中，都要有在这个josn中配置是组件， {“component”: true} 这个万万不能少了
这里写图片描述

  1. {
  2.   "component": true,
  3. }

4.重点2：调用自定义组件，在wxml中调用自定义组件，标签的名称是你定义的wxml名称，例如：wxml 调用的标签名称是 ，js中生命周期中初始化自定义组件，例如：this.pwddialog= this.selectComponent("#pwddialog"); ，json文件中一定要配置使用自定义组件，否则报本文章开头的错误

wxml

  1. <pwddialog id='pwddialog' pwdtitle="{ { pwdtitle}}" currency="{ { currency}}" amt="{ { balance}}" bind:pwdEvent="_pwdEvent" bind:close_pwd_alert="close_pwd_alert" bind:setFocus="setFocus"></pwddialog>

json

  1. {
  2.   "usingComponents": { "pwddialog":"../components/pwddialog/pwddialog" } }

发表评论

表情：
评论列表 （有 0 条评论，729人围观）

还没有评论，来说两句吧...

相关阅读