我有一个复杂的搜索页面,用户可以使用数百种不同的过滤器指定搜索。我无法想出一种简化使用Vuex
的所有内容的方法。
例如,一个部分允许指定多个与AND / OR操作相关的最小 - 最大范围项目。
伪层次结构如下
<parent>
<multiple-min-max>
<number-input :value="greaterEqualValue"> <number-input :value="lessEqualValue">
<select :op="selectedOp"></select>
<button @click="addNew">
<button @click="removeCurrent"
</multiple-min-max>
...
...
<multiple-min-max /> another usage for a different thing
</parent>
该组件将在很多地方用于不同的事情。
我不知道如何在最顶层组件和最底层之间传递值,并将值返回到正确的存储区中。
有一种明显的单向绑定方式作为道具并将结果发送回链条,但对于上面相对简单的示例,我需要从<number-input>
发出,然后收集<multiple-min-max>
中的所有内容并再次向父母发出。
这似乎是样板的很多,特别是当你有一个 lot 的属性来跟踪时。