vue学习之路.02

第一个vue项目

        1.建立
            vue init webpack app01
        2.安装依赖
            cd app01
            npm install
        3.构建
            npm run dev  启动本机的8080端口
            或
            npm run start  启动本机的8080端口
        4.打包
            npm run build

vue工程项目结构
        app01
            build     webpack配置文件
            config    当前项目的配置文件
            dist    打包后的目标目录
            node-modules    第三方模块存储目录
            src    源码目录
            static    
            index.html    首页
            package.json node项目核心文件
            .babelrc    babel配置文件
            .gitignore    不受git管理的文件如：dist node_modules

vue实例
            new Vue({
                data:{
                    a:1,
                    b:2
                },
                methods:{
                    ... 
                    //集成
                    foo(){
                        this //this指向vue实例
                    }
                },
                components:{}
                //生命周期钩子函数
                beforeMount(){
                    this //this也是指向vue实例
                    $.get('',() => {
                        this //箭头函数中的this指向外层函数的this
                        //能够在这个回调函数中直接访问a
                        this.a
                    })
                },
                mounted(){

                }
            })
            每一个.vue文件中都有一个vue实例
            //约定data为函数，返回一个对象
            export default {
                data(){
                    return {

                    }
                }
            }

            结论：vue中的methods里面的函数，生命周期钩子函数中的this指向当前vue实例
                  vue实例能够直接访问data中定义的变量和methods中定义的函数