Vue-购物车练习

购物车GitHub：GitHub - TsundereAchen/Vue-Demo

插槽Slot

1. 是vue为组件封装的能力，允许用户在开发的时候把不确定的，希望用户指定的部分定义为插槽。
2. vue规定：slot都要有一个name，如果省略掉，name是default。
3. 作用域插槽：v-slot只能放在template或者组件中。
4. template标签，它是一个虚拟标签，只起到包裹作用，不会渲染成任何性质的html元素。
5. 可以在slot中声明后备内容，当用户没有指定填充内容显示，指令覆盖默认内容.

 

 动态指令

动态控制组件的隐藏或者显示。

component是vue内置的，标签占位符作用，is属性是要展示出组件的名称，该名称是在component节点下注册的名称。

<component is="Left"></component>

自定义指令

directives 分为全局和私有指令，注册方法跟过滤器类似。

自定义指令触发会触发bind函数。

bind函数第一次绑定的时候生效，update数据改变的时候生效，第一次不生效。

如果bind和update逻辑一样，则自定义指令可以简写成函数。

 directives: {
        color: {
            bind(e, binding) {
                e.style.color = binding.value;
            }
        }
    }

        <p class="pp" v-color="'pink'">{{ count }}</p>