使用标牌组件实现加减计数器的效果

实现效果：

从上面的动图中可以看到，当我们点击左右两侧的 “-1” 和 “+1” 按钮时，中间的数字0会随之加减。这里主要是对回调的运用，三个标题组件会通过数据过滤器来接受数据容器发出的回调 count ，当我们点击左右两侧的标题时，它们会基于count进行 -1或+1的运算得到新的值，然后通过回调newCount来发送给数据容器，数据容器的特性是当数据发生变化时，它会立刻触发自己的回调，也就是说，接收到newCount后，数据容器会把newCount通过回调count重新发送给标题，以此来构建一个完整的交互循环。

实现思路：

1.先创建三个标题，将它们的text字段分别设置为 -1，0，+1，然后我们再创建一个数据容器组件，这个数据容器的主要作用是获取到最新的数值（newCount），然后分发给三个标题，标题组件通过接受数据容器的回调（count）来得到最新值。

2.我们给左右两侧的标题分别添加一个数据过滤器，用来返回新的数值。

左侧的数据过滤器：

右侧的数据过滤器：

中间的标题数据过滤器：

可以看到，两侧的数据过滤器都返回了一个新的字段count，新count的值是基于回调count来计算的。

3.然后给两侧的标题添加一个回调，将count赋值给newCount发送出去。

4.对数据容器而言，它需要做的就是接受newCount后，再把newCount赋值给count返回给三个标题即可，所以我们也需要给它添加一个数据过滤器和回调。

这样，我们的标题计数器就完成了。

demo：📎加减计数器_1976693.zip