Meituan-Dianping / mpvue

基于 Vue.js 的小程序开发框架,从底层支持 Vue.js 语法和构建工具体系。
http://mpvue.com
MIT License
20.42k stars 2.07k forks source link

mpvue无法使用selectComponent #605

Open kalooboy opened 6 years ago

kalooboy commented 6 years ago

[问题简单描述]

问题复现步骤:

showDialog() {
      console.log(this);
      let dialogComponent = this.selectComponent(".wxc-dialog");
      dialogComponent && dialogComponent.show();
    },

在调用该方法时会报以下错误: image

期望的表现: 希望能给出一个使用的办法

shaonialife commented 6 years ago

// 不能再created 里面调用 this.$mp.page.selectComponent('#xxx')

Jeesoong commented 6 years ago

@shaonialife this.$mp.page.selectComponent is not a function; 在onLoad里面调用也会提示这个错误,page对象里面没有这个方法 控制台里面输出page如下

2018-06-29 11 25 59
jcto commented 6 years ago

@shaonialife created 是vue什么生命周期,不是小程序的,此时调用小程序实例肯定不对吧

kevinlvhsl commented 6 years ago

不论生命周期, 我在页面渲染好了也报错。 旧一点的版本mpvue 还可以使用selectComponent,最新版就不可以了。 这样使用一些第三方UI库会有影响。 求解决方案。

kevinlvhsl commented 6 years ago

不论生命周期, 我在页面渲染好了也报错。 旧一点的版本mpvue 还可以使用selectComponent,最新版就不可以了。 这样使用一些第三方UI库会有影响。 求解决方案。

新版的mpvue-cli脚手架中, 需要将main.js里面的config 改成main.json中去。

export default {
  config: {
    navigationBarTitleText: '登录',
    usingComponents: {
      'i-button': '/static/iView/button/index',
      'i-toast': '/static/iView/toast/index'
    }
  }
}

-> main.json

{
    "navigationBarTitleText": "登录",
    "usingComponents": {
        "i-button": "/static/iView/button/index",
        "i-toast": "/static/iView/toast/index"
    }
}
iduma commented 5 years ago

不论生命周期, 我在页面渲染好了也报错。 旧一点的版本mpvue 还可以使用selectComponent,最新版就不可以了。 这样使用一些第三方UI库会有影响。 求解决方案。

不要放在 created 里,要放在 mounted 里。

zavven commented 5 years ago

this.$root.$mp.page.selectComponent(.xxxx)

styjs commented 4 years ago

和楼主2的没有什么区别 打印出来之后 会发现mpvue重写地page里面没有selectComponent方法