Vue——API 实例(V2.x)

1，实例property: vm.$data, vm.$slots, vm.$parent, vm.$props, vm.$el, vm.$options, vm.$root, vm.$attrs, vm.$scopedSlots, vm.$refs, vm.$listeners, vm.$isServer, vm.$children:

vm.$data:Object;(这是什么？在什么时候赋值？有什么用？保留原始数据对象)：vm.$data是经过合成的数据对象，有实例本身的data，也有混入的data；vm.$data是个响应式的，并且实例代理了$data的property;不允许移除或直接修改vm.$data，但是可以修改其属性值；但一般还是使用实例代理属性达到方式；

//假设属性'a'本身就存在vm.$data上的;以下两句是一样的；
vm.$data.a = 5;
vm.a = 5;

vm.$slots:(这是个对象，在预编译的时候给值的吗？会在哪里使用？)$slots是那些没有使用插槽作用域的插槽内容；是个对象，每个属性值节点集合(数组)；在render函数时，可以使用vm.$slots以完成在template插槽的作用；name为default的插槽内容在不管怎样都会在$slots中，且在create生命周期钩子中可以方法，其他的在mounted之前不可访问；

//第一个template元素(没用v-slot指出default)及其子节点会分发给name为
//default(以下省略了name)的slot；
//第二个分发给name为test的slot
//第三个分发给name为ball的slot
//default和test的插槽内容没有使用插槽作用域；ball使用了，虽然对应的slot没有任何attributes
//没有使用作用域的插槽内容会出现在vm.$slots中，属性名便是插槽的name，属性值是个数组；
//如{test: [VNode, VNode, VNode]},之所以是3个，是因为两个span元素之间的换行算做一个节点；
<my-comp>
    <template>
        <span>without slot scope</span>
    </template>
    <template v-slot:test>
        <span>slot  scope</span>
        <span>more than one elements </span>
    </template>
    <template v-slot:ball="options">
        <span>now</span>
    </template>
</my-comp>

var myComp = {

    name: 'my-comp',
    template=`<div>
                <span>noting here</span>
                <slot></slot>
                <slot item="hello" name="test"></slot>
                <slot name="ball"></slot>
            </div>`,
};
//若是插槽内容是以下这样：那么，第一个template v-slot="onk"表示分发到name为default的插槽；
//但是最后一个没有标明插槽名字的将被抛弃，若是它加上v-slot="onk" 或者v-slot:default,
//那它将覆盖前面与default匹配的内容；
<my-comp>
    <template v-slot="onk">
        <span>without slot scope</span>
    </template>
    <template v-slot:test>
        <span>slot  scope</span>
        <span>more than one elements </span>
    </template>
    <template v-slot:ball="options">
        <span>now</span>
    </template>
    <template>text</template>
</my-comp>

vm.$scopedSlots: 在挂载之前的生命周期中无法访问；现在可以在$scopedSlots