c***@163.com
c***@163.com
  • 发布:2023-08-07 15:21
  • 更新:2023-08-07 15:21
  • 阅读:157

【bug】app端 与 h5 端 slot 内 v-model 的 视图数据 无法更新

分类:uni-app

在h5端是没问题的,但是在app端 slot 视图无法更新

// 父页面  
<template>  
    <view>  
        {{ JSON.stringify(formData) }}  
        <SearchCollapse class="search-box" @reset="resetForm">  
            <template v-slot:content>  
                <input v-model="formData.name" class="search-input" placeholder="请输入" />  
            </template>  
        </SearchCollapse>  

    </view>  
</template>  

<script>  
import SearchCollapse from '@/components/search-collapse/search-collapse.vue'  

export default {  
    components: {  
        SearchCollapse,  
    },  
    data() {  
        return {  
            formData: {  
                name: "", // 初始化 formData 的默认值  
            },  
        };  
    },  
    methods: {  
        resetForm() {  
            console.log('resetForm');  
            this.formData.name = ""; // 重置输入框的值  
        },  
    },  
};  
</script>  
// searchCollapse 组件  
<template>  
    <view>  
        <slot name="content" :reset="reset"></slot>  
        <button @click="reset">重置</button>  
    </view>  
</template>  

<script>  
export default {  
    methods: {  
        reset() {  
            console.log('reset');  
            this.$emit("reset"); // 向父组件发送重置事件  
        },  
    },  
};  
</script>  
2023-08-07 15:21 负责人:无 分享
已邀请:

要回复问题请先登录注册