前端技术笔记|uniapp使用this.$parent修改父级数据在H5端不生效

250 阅读1分钟

父组件

<template>
  <view>
    <children></children> 
  </view>
</template>
<script>
  export default {
    data: {
      return {
		current: 0
	  }
    }
  }
</script>

子组件

<template>
  <view>
    <button @click="handleParent">调用父组件方法</button>
  </view>
</template>
<script>
export default {
    methods: {
      handleParent(){
		this.$parent.current = 1;
	  }
    }
  }
</script>

在H5环境下,current值不生效,这是因为在uniapp中标签也是一个组件

解决方案

有几层组件就写几个$parent即可

this.$parent.$parent.current = 1;