vue-关于参数值大小写不一致导致的问题

220 阅读1分钟

从首页pages/home/home点击跳转到pages/list/list页面

参数存储在storage中,根据传递的参数修改tab状态

image.png

onShow() {
    //从首页跳转进来获取到的筛选条件
    const homeFilter = this.$utils.getStorage('homeToPatientFilter')

    console.log(homeFilter, 'homeFilter')
    if (homeFilter) {
        //判断是否是全部和已关注的筛选
        if (homeFilter.hasOwnProperty('isfollowed')) {
            this.isfollowed = homeFilter.isfollowed
        } else {
            //图表 清空原有条件
            Object.keys(this.selectData).map((item) => {
                this.$set(this.selectData, item, homeFilter[item] ? homeFilter[item] : [])
            })
            this.hasSelect = true
        }
    }
    console.log(this.isfollowed, 'onShow---1')
    this.getList(true)
    console.log(this.isfollowed, 'onShow---2')
},
mounted() {
    console.log(this.isfollowed, 'mounted')
},

methods: {
    console.log(loading, 'loading')
    console.log(this.pageInfo, 'pageInfo')
    console.log(this.selectData, 'selectData')
    console.log(this.isFollowed, 'isFollowed')

}

问题:onShow事件中,参数值打印已经是修改了的,但是在getList中,返回的还是原先的值?

image.png

参数值用到的组件

<PatientTabs :currentTab="isFollowed" @handleTabs="handleTabs" />

解决1:

尝试了v-if

v-if="dataList && dataList.length > 0"

解决2

尝试了子组件watch监听

props: {
        currentTab: {
            type: Number | String,
            default: '0',
        },
    },

    data() {
        return {
            current: this.currentTab,
        }
    },
    watch: {
        currentTab(newVal) {
            this.current = newVal
        },
    },

尝试$nextTick

this.$nextTick(() => {
    this.getList(true)
})

结果:参数值大小写不对,我就是个渣渣

isFollowed