uniapp开发父组件调用子组件方法报错“this.$refs.xxxx“，检查是否组件用了v-if，如果是改为v-show试试

 

在父类组件中

<template>
    <view>
        <MemberLogged ref="isLogged" @toLogIn="gotoLogging" v-if="proposItem.active===1"></MemberLogged>
    </view>
</template>

 

 

子类组件中有

methods: {
      
            showLogged: function(data) {
                console.log("我被父组件调用了")
                this.propsItem.isLogged=data;
            
            },

}

 

当父类组件的方法中执行this.$refs.isLogged.showLogged(this.proposItem.isLogged);报错this.$refs.xxxx

后来网上找了很久父类调用字类的方法，都这么写的，最后发现一篇比较好的博文，说如果组件中用了v-if也会引起这个问题，后我修改父类组件如下

<template>
    <view>
        <MemberLogged ref="isLogged" @toLogIn="gotoLogging" v-show="proposItem.active===1"></MemberLogged>
    </view>
</template>

 

问题得到解决

开发父组件调用子组件方法报错"this.$refs.xxxx"，检查是否组件用了v-if，如果是改为v-show试试