2

我正在使用ember-route-action-helper

我有一个看起来像这样的组件垫片：

{{component-name model=model 
action1=(route-action "action1") 
action2=(route-action "action2") 
action3=(route-action "action3") 
action4=(route-action "action4") 
action5=(route-action "action5") 
action6=(route-action "action6") 
action7=(route-action "action7") 
action8=(route-action "action8")
action9=(route-action "action9") 
action10=(route-action "action10")
action11=(route-action "action11")
action12=(route-action "action12") 
action13=(route-action "action13") 
action14=(route-action "action14")
}}

PS 以上动作未使用真实动作名称

有很多动作需要冒泡到路由，我不在我的 ember 应用程序中使用控制器。

由于动作太多，这看起来有点笨拙。有没有办法以另一种格式表示相同的信息或将其写入我的组件.hbs文件或.js文件中的其他位置？

4

3 回答 3

7

你的问题相当于问，“为什么这个函数看起来这么笨重？”：

function(model, arg1, arg2, arg3, arg4, arg5, arg6, arg7, arg8, arg9, arg10, arg11, arg12, arg13, arg14) {
    ....
}

答案是：你需要以不同的方式分解你的代码。拥有一个有 15 个参数的函数绝不是一个好主意，出于完全相同的原因，组件也是如此。

有几种方法可以更清楚地分解此代码。也许其中一些操作可以改为专用服务。也许其中一些可以分组为中间表示（比如一个有自己动作的模型）。可能如果您没有通过创建不执行任何操作的“垫片”来添加不必要的模板层，您可以直接将这些操作中的每一个传递到相关的子组件中，这会将它们分散到整个模板的逻辑位置。

如果没有看到您的更多细节，我无法判断这里的适当策略是什么。

于 2016-12-31T16:57:50.460 回答
1

我认为有一个捷径，您可以尝试直接route-action从组件调用而无需一路向下传递。

<button {{action (route-action 'appRouteAction') }}>My-Component button</button>

检查这个ember-twiddle 我不确定，这是正确的方法吗？

于 2016-12-31T15:23:22.563 回答
0

您仅将操作（函数）UP传递给路由以进行数据操作，因为它是数据所有者。

其他与数据无关的操作不应传递给路由。

可能的解决方案，

  1. 将所有应用程序共享状态（与数据无关）放入 aservice并将其注入到组件中
  2. 在组件内部调用模型（传递给组件的数据）方法，而不是让路由完成工作
于 2017-02-22T02:34:07.380 回答