效果：

1.主页效果：

肉类页面效果：

二.使用插槽slot扩展定义组件，使用过vue的同学应该都能理解。

所谓插槽就是在不修改组件内部代码情况下，还能在外面按需扩展。这样就不会影响到原来使用了该组件的地方。

插槽使用步骤：

1. 单个插槽使用，这种情况slot不用使用name属性。小程序自己会匹配。

在scroll-comp.wxml最后面加入：

<slot></slot>

1. 多个插槽使用，例如我想在scroll-comp组件最上方和最下方添加按钮，那么先要在最上方使用用slot,然后最下方也用slot。然后分别给他们取上名字。最后还有要在scroll-comp.js里添加上options，这样该组件才支持多个插槽。

1. 在index.wxml页面中写上两个按钮，然后在使用slot属性指明用于哪个slot。

总结：

1. 组件之间引用，主要是要配置.json文件中的 "usingComponents"。
2. 组件扩展，是使用slot插槽扩展组件原来没有的功能，不影响组件原来代码。

谢谢大家浏览，喜欢的点个赞或者关注下，虽然都只是入门级别的，但只有入门级别的掌握好了才能往上走。以前看别人技术博客，觉得几分钟就看完，殊不知别人花了多少时间写。

我是只说代码的大饼，不要只是写代码时想起我，饿了也可以想起我。

发表评论    取消回复

名称(*)

邮箱(*)

网址

评论 ◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。