在TabContent中进行了页面 currentIndex 的下标判断，这样做会让整个页面重新渲染。可以把页面下标传递给子组件，在子组件中使用@Watch装饰器对接收的父组件下标进行装饰，达到状态变量更改通知。具体使用如下
父组件中的tabs
Tabs({ index: this.currentIndex }) {
TabContent() {
QualityNumView({ homeTabIndex: this.currentIndex })
}
TabContent() {
TodayAlarmView({ homeTabIndex: this.currentIndex })
}
TabContent() {
DeviceLocationView({ homeTabIndex: this.currentIndex })
}
TabContent() {
GasTypeView({ homeTabIndex: this.currentIndex })
}
}
.animationDuration(0)
.layoutWeight(1)
.height(AppConstants.FULL_PERCENT)
.width(AppConstants.FULL_PERCENT)
.barHeight(0)
.scrollable(false)
.onChange((index) => {
this.currentIndex = index;
})
子组件中如下： 这样做每次切换就只会加载onRefresh方法请求数据 ，首次加载页面进入方法aboutToAppear
@Component
export struct GasTypeView {
//使用@Watch装饰器 状态变量更改通知 如果父组件的下标更改了
//那就会接收到通知进入onRefresh方法 在onRefresh中进行数据请求
@Link @Watch('onRefresh') homeTabIndex: number
//后边进行tab页面切换就会进入此方法
onRefresh() {
if (this.homeTabIndex === 1) {
this.getData()
}
}
//子组件中aboutToAppear方法只会加载一次
aboutToAppear(): void {
if (this.homeTabIndex === 1) {
this.getData()
}
}
getData() {
// 进行数据请求
}
build() {
}
}
