Как обратиться к ключу объекта?

Question

[kot98]

Условно, в родительском компоненте есть объект objects = { a: {pos: 1}, b: {pos: 2}, c: {pos: 3}}. В родительском компоненте через props я передаю в дочерний objects.b. Есть несколько одинаковых компонентов, куда я передаю и objects.a и objects.c.
В случае с передачей objects.b - в дочернем получаю {pos: 2}. Затем из дочернего мне нужно передать именно ключ b в родительский, чтобы затем пройтись по objects и при совпадении ключей (a, b или c) выполнить действия над значением {pos: 2}.
Реализовал это пока через отдельную передачу пропсами тупо текстом ('a','b','c') для каждого компонента. Работает, но думаю, что есть способ лучше.

Answer 1

[0xD34F]

из дочернего мне нужно передать именно ключ b в родительский

Не нужно.

В родительском компоненте вы знаете, кому какой ключ соответствует. Т.е., из дочернего достаточно просто просигналить о необходимости совершения какого-то действия, а родитель дальше сам разберётся. Типа так:

Дочерний компонент: this.$emit('do-something').
Родительский компонент:

<child-component :object="objects.a" @do-something="doSomething('a')" />
<child-component :object="objects.b" @do-something="doSomething('b')" />
<!--> или <-->
<child-component v-for="(v, k) in objects" :object="v" @do-something="doSomething(k)" />

methods: {
  doSomething(key) {
    // чего-то делаете
  },
  ...

Или даже проще, без ключей. Так как, по вашим же словам, ключ вы передаёте, чтобы

затем пройтись по objects и при совпадении ключей (a, b или c) выполнить действия над значением

, то почему бы сразу не обращаться к нужному значению?

<child-component :object="objects.a" @do-something="doSomething(objects.a)" />
<child-component :object="objects.b" @do-something="doSomething(objects.b)" />
<!--> или <-->
<child-component v-for="n in objects" :object="n" @do-something="doSomething(n)" />

Ещё можно отправлять из дочернего компонента наверх сам объект: this.$emit('do-something', this.object). Тогда не придётся дублировать обращение к нему в родителе:

<child-component :object="objects.a" @do-something="doSomething" />
<child-component :object="objects.b" @do-something="doSomething" />
<!--> или <-->
<child-component v-for="n in objects" :object="n" @do-something="doSomething" />

Answer 2

[Smirator]

<li v-for="(val, key) in data" :some-data="key">{{ val }}</li>

Почитать тут: https://ru.vuejs.org/v2/guide/list.html#v-for-%D0%...

Если правильно понял вопрос