Vue.JS 2.5.1: Uncaught SyntaxError: Неожиданный экспорт токена - PullRequest
Новая
       11

Vue.JS 2.5.1: Uncaught SyntaxError: Неожиданный экспорт токена

0 голосов
/ 09 октября 2018

Я пытался сделать переключатель с помощью VueJS и Bootstrap Vue, но это происходит, когда я делаю это.Я ожидаю, что это будет синтаксическая ошибка точно так же, как она сказала, но я не могу найти никакой подсказки.

Итак, я попытался скопировать вставленный код, вот полный код test_radio.php 

<!DOCTYPE html>
<html>
<head>
    <link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap/dist/css/bootstrap.min.css"/>
    <link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.css"/>
</head>

<body>
<template>
  <div>
    <b-form-group label="Radios using <code>options</code>">
      <b-form-radio-group id="radios1" v-model="selected" :options="options" name="radioOpenions">
      </b-form-radio-group>
    </b-form-group>

    <b-form-group label="Radios using sub-components">
      <b-form-radio-group id="radios2" v-model="selected" name="radioSubComponent">
        <b-form-radio value="first">Toggle this custom radio</b-form-radio>
        <b-form-radio value="second">Or toggle this other custom radio</b-form-radio>
        <b-form-radio value="third" disabled>This one is Disabled</b-form-radio>
        <b-form-radio :value="{fourth: 4}">This is the 4th radio</b-form-radio>
      </b-form-radio-group>
    </b-form-group>

    <div class="mt-3">
      Selected: <strong>{{ selected }}</strong>
    </div>
  </div>
</template>

    <!-- Vue.js @2.5.1 -->
    <script type="text/javascript" src="js/vue.js"></script>

    <!-- Add this after vue.js -->
    <script src="//unpkg.com/babel-polyfill@latest/dist/polyfill.min.js"></script>
    <script src="//unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.js"></script>

<!-- The error is below -->
<script>
export default {
  data () {
    return {
      selected: 'first',
      options: [
        { text: 'Toggle this custom radio', value: 'first' },
        { text: 'Or toggle this other custom radio', value: 'second' },
        { text: 'This one is Disabled', value: 'third', disabled: true },
        { text: 'This is the 4th radio', value: {fourth: 4} }
      ]
    }
  }
}
</script>
</body>
</html>

Uncaught SyntaxError: Неожиданный экспорт токена

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

Я все еще новичок в Javascript, Vue.JS и Bootstrap Vue, поэтому любая помощь будет полезна, спасибо!В любом случае, этот код взят из документации Bootstrap Vue .

1 Ответ

0 голосов
/ 11 октября 2018

Если вы собираетесь использовать подход CDN, VueJS начинается с 

<!-- Begin of area that is impacted by VueJS -->
<div id="app">
   <b-form-group label="Radios using <code>options</code>">
     <b-form-radio-group id="radios1" v-model="selected" :options="options" name="radioOpenions">
     </b-form-radio-group>
   </b-form-group>
</div>
<!-- End of area that is impacted by VueJS -->


<script>
 var app = new Vue({
   el: '#app',
   data: {
      ...
      }
   })
<script>

. '#app' - это то, что связывает разделы, а не импорт / экспорт

...