方法一:通过在父组件的onShow调用子组件的方法(请求) 实现页面的刷新
父组件 html
<stock :obj="obj" ref="stock" />
js
onShow() {
console.log('我是onshow')
this.$refs.stock.getData()
},
子组件
js 请求的参数必须在data中初始化
data() {
return {
tableData:{},
info:{
directorEnabled: JSON.parse(uni.getStorageSync('userInfo')).directorEnabled,
managerId:JSON.parse(uni.getStorageSync('userInfo')).branch.managerId,
token: uni.getStorageSync('token'),
beginTime: 1600854391,
endTime:1700854463,
displayEnable: false,
businesserId:JSON.parse(uni.getStorageSync('userInfo')).directorEnabled?JSON.parse(uni.getStorageSync('userInfo')).id:''
},
};
},
方法:
async getData(type){
let json = await api.tarvelIndex(this.info)
console.log(json,'我是json')
if(json.status === 200){
json.data.map(item=>{
if(item.id = this.obj.id){
this.tableData = item
}
})
}
},
方法二:v通过-if 在父组件中的onShow 创建和 onHide销毁组件
父组件 html
<stock :obj="obj" v-if="flag" />
js
onShow() {
this.flag = true
},
onHide() {
this.flag = false
},
子组件正常使用
本文介绍了两种在Vue中实现页面刷新和组件管理的方法。第一种是在父组件的onShow事件中调用子组件的方法来刷新数据,通过控制子组件的数据请求实现页面更新。第二种方法是利用v-if在onShow时创建组件,在onHide时销毁,达到刷新效果。同时详细展示了子组件中数据初始化和请求处理的实现细节。
9150

被折叠的 条评论
为什么被折叠?



