Возможно ли иметь ассоциативный массив в Vue. js без использования объекта?

Question

Я пытаюсь получить ассоциативный массив, но этот синтаксис выдает ошибку как знак лямда. Как бы я это сделал? Я хотел бы избежать использования объекта, потому что ключ должен быть строкой с заглавными буквами и пробелами.

<script>
export default {
    name: 'VueHeader',
    data() {
        return {
            links : ['Dashboard' => '/dashboard', 'Account' => '/account'],
        }
    }
}
</script>

Answer 1

Как правильно говорит другой ответ, простые объекты действуют как ассоциативные массивы в JavaScript:

...
links : {'My Dashboard': '/dashboard', 'My Account': '/account'},
...

Ключи могут быть произвольными строками. Если ключ содержит пробелы или другие символы, отличные от алфавита c, доступ к нему можно получить с помощью обозначения в скобках . Поскольку это фундаментальная функция JS, она поддерживается в шаблонах Vue:

{{links['My Dashboard']}}

Проблема с простыми объектами заключается в том, что спецификации не гарантируют порядок ключей, хотя он фактически сохраняется во всех текущих реализации.

Современная альтернатива, гарантирующая заказ - ES6 Map. Он в настоящее время не реагирует в Vue и может заменить простой объект только для данных о состоянии c:

...
links : new Map([['My Dashboard', '/dashboard'], ['My Account': '/account']]),
...

Answer 2

<script>
export default {
  name: 'VueHeader',
  data() {
    return {
      links : {'Dashboard': '/dashboard', 'Account': '/account'},
    };
  }
}
</script>

JS Объекты могут использовать строки в качестве ключей. Они будут соответствовать вашим потребностям, потому что 'Foo' !== 'foo'. Возьмите следующий пример:

> x = {"foo": 10, "Foo": 20, "foo bar": 15}
{ foo: 10, Foo: 20, 'foo bar': 15 }
> x['Foo']
20
> x['foo']
10
> x['foo bar']
15

Answer 3

Поскольку в javascript отсутствует такая вещь, как ассоциативный массив, массив всегда должен иметь свои целочисленные индексы в возрастающем порядке.

Вместо этого вы можете просто создать вместо этого объект и получить доступ к свойство в обозначении массива как таковое:

const obj = { 'Dashboard': '/dashboard', 'Account': '/account' };

console.log(obj['dashboard']);
console.log(obj['Account']);