这是一个创建于 1176 天前的主题，其中的信息可能已经有所发展或是发生改变。
循环子组件，数据通过 props 传递，其中一个编辑完了之后在外面点击提交，怎么拿到子组件的数据？
大概就是这么个情况，想半天没想出来
 |
1
EscYezi 2021-08-31 23:45:32 +08:00 via iPhone
用 store 模式可以（貌似不应该这样做
|
 |
2
dvsilch 2021-09-01 00:04:23 +08:00  1
我是把数据放在父组件维护，给子组件的数据加上.sync 修饰符，然后 emit('update: propsName')保证数据同步
|
 |
3
xiaoming1992 2021-09-01 05:45:20 +08:00 via Android
既然通过 props 传递，那子组件就应该在 onchange 或者 onblur 的时候将自身的状态往父组件抛。或者也可以用 ref，让父组件持有子组件的引用也行。
|
 |
4
SxqSachin 2021-09-01 08:56:08 +08:00 1
父组件持有数据，子组件变动时反馈给父组件
|
 |
5
gromit1337 OP @dvsilch #2 3.x 现在是用 v-model 我试了，好像不可以和 v-for 一起用
|
|
6
gromit1337 OP @SxqSachin #4 外面点击提交，编辑状态的子组件怎么知道自己该提交了
|
 |
7
suyi2015 2021-09-01 10:21:16 +08:00
父组件设计数据结构 存储 子组件的取值函数（子组件初始化完成后进行设置）。
提交时父组件依次调用各个取值函数组装出完整数据。 |
 |
8
RexG 2021-09-01 10:21:18 +08:00
可以在 v-for 中给子组件设置 ref，例如 :ref='"test"+item.id' 然后提交是的时候遍历 refs，触发子组件内部函数，函数体当然是返回子组件数据或者其他你希望的操作。
当然正常情况应该是把数据交给父组件保存，子组件只负责通过 emit 修改数据，不太清楚你这个循环子组件是干什么的？ |
 |
9
Kimen 2021-09-01 10:23:57 +08:00
最简单的就是用 ref，还有就是 vue-bus 或者 vuex，都可以
|
|
10
dvsilch 2021-09-01 10:46:38 +08:00
|
|
11
gromit1337 OP @RexG #8 数据是在父组件里的，但是子组件里会修改
|
 |
12
shintendo 2021-09-01 13:32:27 +08:00
|
|
13
shintendo 2021-09-01 13:33:15 +08:00
|
 |
14
summerLast 2021-09-01 14:54:23 +08:00
有三种方式
1 $emit 2 $refs 3 vuex |
|
15
summerLast 2021-09-01 14:55:31 +08:00
@summerLast v-model 和第一种类是
|
|
16
dvsilch 2021-09-01 15:33:45 +08:00
@gromit1337 你可能没有在 set 函数里进行$emit 通知父组件更新，因为这个值就是在父组件维护的
|
Select Language