vueJS2.0

常量和變量

  • let 來(lái)聲明變量

  • const來(lái)聲明常量,常量一旦聲明無(wú)法改變

  • 字符串的拼接

let name = "xmg";
    let age = 10;
    let  res = `我叫${name}--年齡${age}`;
    alert(res);

    let list = ['1','2','3'];
    let list2 = ['4','5','6'];
    //...數(shù)組的名稱(chēng)  展開(kāi)數(shù)組
    let resList = [...list,...list2];

    /*對(duì)象賦值*/
    let obj = {name:'123',age:0,address:'123'};
    let obj1 = {name:'xmg',age:12}
    let obj2 = {name:'gxq',age:10,address:'address'};
    /*合并對(duì)象 如果有相同的key,后面的對(duì)象會(huì)給前面的對(duì)象,給覆蓋掉。*/
    Object.assign(obj,obj2);

    console.log(obj);

    let obj3  = {
        name() {
            alert('name');
        }
    }
    obj3.name();

箭頭函數(shù)

  • 箭頭函數(shù)就是對(duì)匿名函數(shù)的簡(jiǎn)寫(xiě)
var fnres = function () {

     }

 var fn = ()=>{
     alert('show');
     }
     fn();

let fn2 = function (args) {
        alert(args);
    }
    fn2(10)

//擁有一個(gè)參數(shù)可以用以下方式簡(jiǎn)寫(xiě)
let fn2 = args => {
        alert(args);
    }
    fn2(10);

 this.$http.get('/someUrl').then( response=> {

    }, response => {
        // error callback
    });

元組

  function test() {

        return ['10','20'];
    }


    let [a,b] = test();
    console.log(a,b);


    /*結(jié)構(gòu)對(duì)象*/
    function breakfast() {
        return {dessert:'bra1',drink:'bra2',fruits:'bra3'}
    }
    /*把對(duì)象當(dāng)中的屬性賦值給結(jié)構(gòu)*/
    let {dessert:dessert,drink:drink,fruits:fruits} = breakfast();
    console.log(dessert,drink,fruits);

類(lèi)


    class baby{

        constructor(weight,sex){  //構(gòu)造方法:在創(chuàng)建實(shí)例時(shí),會(huì)自動(dòng)調(diào)用該方法 初始化方法
            this.weight  = weight;
            this.sex = sex;
            this.age = 1;
        }

        show(){
            alert(this.weight+this.sex+this.age);
        }

        get xmg(){ /*get方法什么時(shí)候調(diào)用:*/
            return this.age;
        }

        set xmg(val){
            alert(val);
        }


        static say(){ /*靜態(tài)方法:不需要?jiǎng)?chuàng)建對(duì)象,直接使用類(lèi)名調(diào)用的方法 叫靜態(tài)方法*/
            alert("hello world");
        }

    }

/*   var per = new baby('8','男');
    per.show();*/

    var per2 = new baby('5','女');
    //alert(per2.xmg);//會(huì)自動(dòng)調(diào)用該屬性的get方法。
    per2.xmg = 10;
    /*baby.say();*/

路由的區(qū)別

    // 1. 定義(路由)組件。
    const home = { template: '<div>home</div>' }
    const music = { template: '<div>music</div>' }
    const singer = { template: '<div>singer</div>' }

    // 2.定義路由
    const routes = [
        { path: '/home',
           component: home ,
           children:[{ path: '/login', component: music }]
        },
        { path: '/music', component: music },
        { path: '/singer', component: singer },
        { path: '/', redirect: '/home' }
    ];

    /*3. 創(chuàng)建 router 實(shí)例,然后傳 `routes` 配置*/
    const router = new VueRouter({
        routes // (縮寫(xiě))相當(dāng)于 routes: routes
    })

    const app = new Vue({
        router
    }).$mount('#app')

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容