Как сравнить значение с ключом объекта?

Question

[kot98]

Есть объект filters:

const filters = ref<Record<string, innerValueType>>({
  id: {
    innerValue: '',
  },
  dateTime {
    innerValue: '',
  },
...
})

И есть блок с тэгами

<div v-for="(filter, index) in filters" :key="index">
            <el-tag v-if="filter.innerValue" closable @close="closeFilter">
              <div v-if="<b>___</b>">{{ editedData(filter.innerValue) }}</div>
              <div v-else>{{ filter.innerValue }}</div>
            </el-tag>
          </div>

В строке {{ editedData(filter.innerValue) }} нужно провести сравнение, когда ключ filters === 'dateTime'. Как это правильно реализовать?

Comments

[Александр]

Попробуй:

<div v-for="(filter, index) in filters" :key="index">
  <el-tag v-if="filter.innerValue" closable @close="closeFilter">
    <div v-if="Object.keys(filters)[index] === 'dateTime'">{{ editedData(filter.innerValue) }}</div>
    <div v-else>{{ filter.innerValue }}</div>
  </el-tag>
</div>

Answer 1

[Aetae]

Твой index - и есть в данном случае ключ. Т.е. проверять нужно просто index === 'dateTime'.

Опережая возможный вопрос - если тебе нужен именно цифровой индекс, то в случае с объектом на входе он будет третьим параметром:v-for="(filter, key, index) in filters". Однако в твоём случае он не нужен, т.к. лучше привязывать key именно к ключу.

В vue всё для людей.)

Comments

[kot98]

Действительно!)
Спасибо!