Ошибка: зарезервированное слово 'var' javascript / vue

Моя миссия очень проста: мне просто нужен массив со строками. Фон состоит в том, что позже я хочу вставить штрих-коды в этот массив.

Но главная проблема сейчас в том, что я всегда получаю:

"index.vue: var - зарезервированное слово"

Я просмотрел vue doc и даже попробовал пример. Но понятия не имею, почему я всегда получаю эту синтаксическую ошибку.

Это моя часть javascript, интересный блок - последний, в котором я хочу объявить свой массив.

<script>
    import axios from 'axios';
    import moment from 'moment';

    export default {
      data() {
        return {
          form: {
            barcodes: [],
            id: this.$route.params.id,
            form: {},
            used_by: '',
            return_time: '',
            barcode: '',
            onSubmit: false,
          }
        }
      },
      methods: {
        onSubmit() {
          this.$message('submit!')

          axios.put('http://127.0.0.1:8000/api/tools/' + this.id, this.form)
          .then(response => {
              console.info(response);
              this.onSubmit = true;
          })
          .catch((error) => {
              console.info(error);
          })
        },
        onCancel() {
          this.$message({
            message: 'cancel!',
            type: 'warning'
          })
        }
      },

      created() {
        axios.get('http://127.0.0.1:8000/api/tools/' + this.id)
        .then(response => {
            console.info(response);
            this.form = response.data;
        })
        .catch((error) => {
            console.info(error);
        })
      },

      var example2 = new Vue({
        el: '#example-2',
        data: {
          parentMessage: 'Parent',
          items: [
            { message: 'Foo' },
            { message: 'Bar' }
          ]
        }
      })

    }

</script>

Это html-часть:

<ul id = "example-2">
   <li v-for = "(item, index) in items">
   {{ parentMessage }} - {{ index }} - {{ item.message }}
   </li>
</ul>

Здесь вы также можете увидеть пример: https://vuejs.org/v2/guide/list.html#Mapping-an-Array-to-Elements-with-v-for

Но я получаю:

index.vue: var is a reserved word (89:2)

  87 |   },
  88 |   
> 89 |   var example2 = new Vue({
     |   ^
  90 |   el: '#example-2',
  91 |   data: {
  92 |     parentMessage: 'Parent',

удалите ключевое слово var, и оно будет работать, как ожидалось

Mosè Raguzzini 09.01.2019 17:23

ну ты в объекте

epascarello 09.01.2019 17:24

потому что вы не можете объявить свойство в объекте с помощью оператора var.

Mosè Raguzzini 09.01.2019 17:25

@ MosèRaguzzini, но это не похоже на собственность, поскольку он использует знак = вместо :, я думаю, это опечатка

Boussadjra Brahim 09.01.2019 17:30

на самом деле вы также не можете использовать знак равенства после ключа объекта. Похоже, вы упускаете основу javascript

Mosè Raguzzini 09.01.2019 17:31

пожалуйста, поделитесь содержимым index.vue

Boussadjra Brahim 09.01.2019 17:33
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
6
441
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

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

  example2: new Vue({
    el: '#example-2',
    data: {
      parentMessage: 'Parent',
      items: [
        { message: 'Foo' },
        { message: 'Bar' }
      ]
    }
  })

А, хорошо, я понял. Но даже когда я включаю свой массив в существующий блок data () - я все равно получаю «Элементы свойства или метода» не определены в экземпляре, но используются во время рендеринга ».

SnakeEyes 10.01.2019 12:17

Это звучит специфично для того, как Vue использует эти данные, и я ничего об этом не знаю. Я просто помогаю вам исправить общий синтаксис JavaScript.

Barmar 10.01.2019 12:20

Хорошо, решил. Я забыл правильное обозначение: form.items

SnakeEyes 10.01.2019 12:56

Другие вопросы по теме