Vue 3自定义复选框组件绑定到所选值的数组
P粉561749334
P粉561749334 2023-12-21 18:43:52
[Vue.js讨论组]

我一直在尝试创建一个带有样式复选框和相应标签的简单组件。所有选定复选框的值(字符串)应存储在一个数组中。这适用于纯 html 复选框:



它会导致以下所需的情况:

现在,如果我用自定义复选框组件替换这些复选框,我将无法使其工作。如果我选中一个框,它发出的值似乎会替换 status 数组,而不是添加到其中或从中删除,从而导致以下结果:

因此,由于某种原因,默认情况下会选中所有复选框,当我单击其中一个复选框时,它们都会被取消选中,并且 status 值会转到 false ,再次单击任何一个复选框将选中所有复选框并使 status true

现在,我知道在发射中返回是否选中该框会返回 true 或 false 值,但我不明白 Vue 如何使用本机复选框执行此操作以及如何使用我的组件实现此行为。

这是我的复选框组件的代码:



并且父组件仅使用不同的模板:

我试图查看 StevenSiebert 的这个答案,但它使用一个对象,我想使用本机复选框复制原始的 Vue 行为。

我还参考了 v-model 上的官方 Vue 文档,但不明白为什么这对于本机复选框的工作方式与对于组件的工作方式不同。

P粉561749334
P粉561749334

全部回复(0)
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号