vue.js的学习1.5

vue.js的学习1.4

1.es6小东西

        /*toggle:function(){
                    alert(1);
                }*/
        等价于：
                toggle(){
                    this.bSign=!this.bSign;
                }

2.vue组件:
组件: 一个大对象
定义一个组件：
全局组件：

var Aaa=Vue.extend({
    template:'<h3>我是标题3</h3>'
});

Vue.component('aaa',Aaa);

*组件里面放数据:
data必须是函数的形式，函数必须返回一个对象(json)

<div id="box">
        <my-aaa></my-aaa>
    </div>

    <script>
        Vue.component('my-aaa',{
            template:'<strong>好</strong>'
        });

        var vm=new Vue({
            el:'#box'
        });

    </script>

局部组件：

var vm=new Vue({
        el:'#box',
        components:{
            'my-aaa':{
                template:'<h2>标题2</h2>'
            }
        }
    });

配合模板:

<template id="aaa">
            <h1>标题1</h1>
            <ul>
                <li v-for="val in arr">
                    {{val}}
                </li>
            </ul>
        </template>

动态组件:

    <component :is="组件名称"></component>