vue iview 使用問題


<html>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

<head>

<!-- import Vue.js -->
<script src="https://vuejs.org/js/vue.min.js"></script>
<!-- import stylesheet -->
<link rel="stylesheet" >
<!-- import iView -->
<script src="https://unpkg.com/iview/dist/iview.min.js"></script>
</head>
<body>
<!--表格模板-->
<template>
    <!--:columns來進(jìn)行表格表頭的綁定，即每列顯示什么內(nèi)容；:data來進(jìn)行數(shù)據(jù)的綁定，即，表格中所對應(yīng)的每列的數(shù)據(jù)是什么-->
    <Table :columns="columns1" :data="data1"></Table>
</template>
<script>
    export default {
        data () {
            return {
            //在腳本中，我們在表格中定義的數(shù)據(jù)和表頭都需要在這里進(jìn)行綁定，下面是一些假數(shù)據(jù)，其中Columns1中的title表示列明，key表示K-V中的標(biāo)識
                columns1: [
                    {
                        title: 'Name',
                        key: 'name'
                    },
                    {
                        title: 'Age',
                        key: 'age'
                    },
                    {
                        title: 'Address',
                        key: 'address'
                    }
                ],
                //接下來綁定數(shù)據(jù)，分別對應(yīng)前面的列的key值來進(jìn)行數(shù)據(jù)綁定
                data1: [
                    {
                        name: 'John Brown',
                        age: 18,
                        address: 'New York No. 1 Lake Park',
                        date: '2016-10-03'
                    },
                    {
                        name: 'Jim Green',
                        age: 24,
                        address: 'London No. 1 Lake Park',
                        date: '2016-10-01'
                    },
                    {
                        name: 'Joe Black',
                        age: 30,
                        address: 'Sydney No. 1 Lake Park',
                        date: '2016-10-02'
                    },
                    {
                        name: 'Jon Snow',
                        age: 26,
                        address: 'Ottawa No. 2 Lake Park',
                        date: '2016-10-04'
                    }
                ]
            }
        }
    }
</script>
</body>
</html>

圖片描述
export default 一直報異常:Unexpected token export,請問我的項(xiàng)目結(jié)構(gòu)如何使用vue? 剛接觸這個

回答

編輯回答

卟乖

你為什么要用export default呢,它又不是單獨(dú)的組件。你如果這樣使用的話,你可以用vue-cli搭建一下工程項(xiàng)目。

2017年7月27日 09:40

編輯回答

清夢

你通過script方式引入的vue，里面又使用export default，這是es6的語法，未編譯是不能在瀏覽器直接運(yùn)行的。如果你要html方式就是目前的方式，語法格式是

var app=new Vue({
      el:"#app",
      data:{
          message:'hello'
      },
      created:function(){

      },
      mounted:function(){

      },
      methods:{

      }
  })

而如果要寫成export default方式，你可以使用vue-cli。你這應(yīng)該是對js不熟悉，對vue不熟悉導(dǎo)致的。

2017年2月25日 12:18

編輯回答