reisaru 2020-05-14 12:07 采纳率: 100%
浏览 3334
已采纳

vue3 无法更改data中数据的值

背景:
线上商城下订单的时候,用户选择存在localstroge中的地址。

父组件:选择地址的页面。selectAdd下的index.vue

子组件:每一个地址。(CheckBox+item地址)

我想实现只能同时选择一个地址,于是给子组件用了一个计数器count,CheckBox的值改变时触发change函数,给count加减。主要代码如下:

 <van-checkbox v-model="checked" @change="select"></van-checkbox>

data(){
            return{
                checked:false,
                count:0,
            }
        },

        methods:{
            select(checked){
                if (checked){
                    this.count+=1;
                }
                else{
                    this.count-=1;
                }


            }
        },


我确定每次改变都会触发select函数,并且都执行了对count的操作,但是结果不会保存。

举个例子:选择了第一个地址输出是this.count=1,选择第二个地址输出还是this.count=1,并且调试时发现,在第二次执行this.count+=1;之前,this.count的值为0。减法也是。

我在很多地方都这样用了data都可以,只有这里data里面的值无法改变,很奇怪。

  • 写回答

2条回答 默认 最新

  • console.log( ) 2020-05-15 09:27
    关注

    那你的计数器不应该放在父组件吗

    子组件每次调用都初始化数据,所以一直是0
    当选中子组件将选中状态返回给父组件,让父组件来计数
    公共组件在不同地方调用数据是不互通的,不然怎么复用

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥15 做了个的二极管反向饱和电流测量电路,但是测试达不到效果
  • ¥15 树莓派启动AP热点传入数据
  • ¥15 multisim中关于74ls192n和DSWPK开关的问题(相关搜索:计数器)
  • ¥15 在误装Windows server2019 后如何利用Windows.old恢复?
  • ¥20 代码实现状态连接包过滤防火墙的设计与实现
  • ¥15 vscode的红色箭头爆红和has no default export报错
  • ¥15 关于#sql#的问题:#情况描述 在用vs对项目进行调试时,出现找不到网络路径,然后查看SQL配置工具,发现SQL服务显示远程调用过程失败(相关搜索:防火墙)
  • ¥15 eNSP中基于默认路由及浮动路由的公司与分部互联和校园网综合项目
  • ¥15 主要进行描述泥浆在管路不同区段泥浆的密度不相同,泥浆的密度有高有低,此时管路的摩阻分布需要怎么计算,(标签-matlab)
  • ¥40 通过编制程序计算圆管内层流充分发展对流换热,参数如图5-4,以及公式5-16所示,要求用表5-6对程序计算准确性进行验证