Skip to content

响应式props解构只支持直接解构,分步解构则失效 #13094

@fuxing2024

Description

@fuxing2024

Vue version

3.5.13

Link to minimal reproduction

https://play.vuejs.org/#eNqNUsGOmzAQ/RXLl81qN6BtUqlKAWW3yqE9bKO2R0sVgSFhF2zLHpJIEf/eMS6UpG20ByT7vTczb5458Uetg30DfMEjm5lSI7OAjU6ELGutDLITM1CwlhVG1eyGpDcD9VSp7VpZ/M0FYQ+4jiRjTMhMSRKkW2CxazR5+HA7Ah/zPJ7csjhhJycnJNinVQN3d0K2QgoZhd4V+aELQq2rFMHdMNo0iEqyZVaV2WssuO8neEKHKPSsV/a+3EXggngvF9whSTQY7+T+i8JhGr/n482uZXVIMdutigIyPMvsY7+0NkrbOIeilLB250m/+YI9N/UGDG0+RHQivKXkuiohR90nk9s46UqdUlUQkMMJyanW1f83OMai3Tw5dZ3bKKTz5a5oqWVRboMXqyQt200RPFO1LiswXzWWNFLwhX80x6VVpQ5fOgxNA/c9nu0ge/0H/mKPDhN8bcCC2dNLDBymZgvo6dX3ZzjSeSBrlTcVqa+Q34DiaJxHL3tqZE62R7rO7efuyUq5/WFXRwRp+6WcUadsO73g9Hyfrqz+x+4smHd19ACUov8lpnWqL3L0xHkTmuHN7hC1XYRhlksqy6Eq9yaQgKHUdbgkWWgaiWUN01zVS5oYvJuHeWlxjAdg6+nGqANFS11Gm7sGXd5makDmYFwub5t7UXY2+4L7a/4olp8kdFFTHrPgffAw4+0vGEaL+w==

Steps to reproduce

点击age按钮改变props,观察控制台的监听器信息是否打印,以及视图是否响应更新会发现响应式依然丢失

What is expected?

应该在点击按钮之后,视图会更新,监听器也会执行

What is actually happening?

点击之后,视图和监听器均无响应,解构props丢失了响应式

我觉得
const props=defineProps({
age: Number
})
const {age} = props
和官方推荐写法
const {age} =defineProps({
age: Number
})
两者应当有一致的表现,结果并非如此

System Info

Any additional comments?

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions