1. 程式人生 > >Vue目錄解析及Vue起步

Vue目錄解析及Vue起步

Vue專案目錄:

目錄解析:

最主要的資料夾是src資料夾

 

對於每個Vue應用,都需要例項化Vue:

 

var vm = new Vue({
    //內容
})

 

例項化的時候都可以設定什麼呢?

<div id="vue_det">
    <h1>site : {{site}}</h1>
    <h1>url : {{url}}</h1>
    <h1>{{details()}}</h1>
</div>



<script type="text/javascript">
    var vm = new Vue({
        el: '#vue_det',
        data: {
            site: "菜鳥教程",
            url: "www.runoob.com",
            alexa: "10000"
        },
        methods: {
            details: function() {
                return  this.site + " - 學的不僅是技術,更是夢想!";
            }
        }
    })
</script>

el:可以繫結某一個元素,這個元素內部的都可以共享Vue

data:data裡可以進行資料繫結。

methods:這裡可以繫結方法。

{{}}可以進行資料繫結

資料的變化也會引起檢視的變化,檢視的變化也會影響資料的變化

使用$訪問el,data,methods屬性

vm.$el

vm.$data

vm.$methods

直接訪問資料:

vm.site

vm.url