Ember组件发送动作路由 [英] Ember component send action to route

问题描述

我有两个组件，一个坐在另一个组件上。我需要从子组件（两个组件在同一路由中使用）发送一条事件。

请让我知道是否有任何标准的方法。

解决方案

简而言之，您可以使用 ember-route-action-helper addon 。

 < button {{action（route-action'onButtonClick'）}}> ClickToCallRouteAction< / button> 
  

有三种方式进行交流，

的 1。旧式经典功能样式即，从顶部到底部传递函数名称作为字符串。在所有的地方我们需要定义相同的功能并提供。使用 sendAction 来泡泡。和发送方法泡沫从控制器到路由层次结构。

这不鼓励。
样式经典风格动作旋转

2。关闭操作
使用操作助手传递函数而不是字符串。所以你不需要在任何地方定义它。
关闭操作的示例旋转样式

3。 route-action-helper addon
你可以直接从任何地方直接调用路由动作，只需使用 route-action 帮助程序包装函数。

示例旋转

经典风格和Closure风格之间的比较以及为什么Closure更可取？

• 在经典风格中，您需要在每个级别定义操作，并使用sendAction触发每个级别的操作，直到您完成嵌套操作。


• 您可以在关闭操作中返回值，但不能在传统操作中返回值。


• 您可以在关闭操作中调用值，但不能在经典操作中。


• 如果没有找到该操作，关闭操作会立即失败。但是通过设计的经典动作，只有在调用
  值时才会懒惰地引发错误。


• 编码复杂性，如谁将处理行动和做业务逻辑？


• 在关闭中，您可以组合动作和mut帮助器来设置具有值的属性。 onclick =（action（mut title）value =titlevalue）


• 在闭包中，可以指定目标对象以调用函数。 （action'save'target = session）将查看的操作 对象，而不是当前的上下文。



strong>

- miguelcamba文章 ember-closing-actions-in-depth

- emberigniter文章 send-closure-actions-up-data-owner

- emberjs blog 1.13发布文章

- 造船厂 - ember-best-practice-stop-bubbling-and - 使用关闭操作

- 来自Embe的博客r地图为什么采取行动帮助？

- 来自Alisdair McDiarmid的博客 ember-closing-actions-have-return-values

- alexdiliberto的博客 ember-closing-actions

I have two component and one sitting on another. I need to send an event to main route from child component( both components use in same route)

Please let me know is there any standard way to do that.

解决方案

For short answer you can you can use ember-route-action-helper addon.

<button {{action (route-action 'onButtonClick')}}>ClickToCallRouteAction</button>

There are three way of actions communication,

1. Old style classic functions style ie., passing function name as string from top to bottom. and in all the places we need to define same function and provide. Use sendAction to bubble. and send method bubble from controller to route hierarchy.

This is not encouraged. Sample classic style actions twiddle

2. Closure actions Use action helper pass function instead of just string. so that you don't need to define it everywhere. sample twiddle for closure actions style

3. route-action-helper addon You can directly call route action from anywhere literally by just wrapping functions using route-action helper.

Sample twiddle

Comparision between Classic style and Closure style and Why Closure is preferrable ?

• In classic style, You need to define actions at each level and use sendAction to trigger the action at each level until you got all the way out of your nesting.
• You can return value in closure actions but not in classic actions.
• You can curry values in closure actions but not in classic actions.
• Closure actions fail immediately if the action is not found. but classic actions by design,would lazily raise errors only upon invocation values.
• Coding complexity like who will handle actions and do business logic?.
• In closure, you can combine action and mut helper to set a property with value. onclick=(action (mut title) value="titlevalue")
• In closure, you can specify target object to invoke function. (action 'save' target=session) would look at the actions hash on the session object instead of the current context.

Some of the promising article regarding this,
- miguelcamba article ember-closure-actions-in-depth
- emberigniter article send-closure-actions-up-data-owner
- emberjs blog 1.13 release article
- dockyard - ember-best-practice-stop-bubbling-and-use-closure-actions
- blog from Ember map Why action helper?
- blog from Alisdair McDiarmid ember-closure-actions-have-return-values
- blog from alexdiliberto ember-closure-actions

这篇关于Ember组件发送动作路由的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！