Ember 组件
香格里拉烤鸡腿
最爱吃烤鸡腿,哪家好吃就去哪家吃
展开
-
#5 自定义组件根元素
英文原版:https://guides.emberjs.com/v2.14.0/components/customizing-a-components-element/默认的,每一个组件都被一个<div>元素包裹。如果你通过浏览器的带的开发工具来观察一下DOM结构的话,你会发现你的每个组件渲染后的DOM最外层元素都如下面这样:<div id="ember180" class="ember-view"翻译 2017-07-10 22:03:15 · 864 阅读 · 0 评论 -
#1 定义组件
英文原版:https://guides.emberjs.com/v2.13.0/components/defining-a-component/定义组件,使用以下命令:ember generate component my-component-name组件在命名时,必须至少带一个”-“号。所以blog-post是一个合法的命名,audio-player-controls也是,但是post是不合法的。翻译 2017-07-01 18:18:37 · 234 阅读 · 0 评论 -
#2 组件生命周期
英文原版:https://guides.emberjs.com/v2.13.0/components/the-component-lifecycle/组件最吸引人的就是它允许你介入DOM。这允许你可以直接对DOM进行操纵,监听和响应浏览器事件,并且你可以在Ember应用中加入第三方JS库。当组件被初次渲染,重新渲染直至最后被移除,Ember提供了一系列的生命周期钩子可以使你在组件特定的生命周期执行特翻译 2017-07-05 21:36:16 · 2846 阅读 · 0 评论 -
#6 块参数
英文原版:https://guides.emberjs.com/v2.14.0/components/block-params/组件可以被传入参数,同时组件也可以通过块参数来返回输出。通过{{yield}}从组件返回值app/templates/index.hbs{{blog-post post=model}}app/templates/components/blog-post.hbs{{yield翻译 2017-07-16 21:10:46 · 187 阅读 · 0 评论 -
#7 事件处理
英文原版:https://guides.emberjs.com/v2.14.0/components/handling-events/你可以在你的组件上通过事件处理函数响应用户事件,比如:双击、悬停等。实现这样的方式比较简单。例子,比如我们现在有个模板:{{#double-clickable}} This is a double clickable area! {{/double-clickab翻译 2017-07-16 22:30:31 · 269 阅读 · 0 评论 -
#3 给组件传递属性
英文原版:https://guides.emberjs.com/v2.14.0/components/passing-properties-to-a-component/组件是与它所在的环境完全隔离的,所以任何组件需要的东西都必须要传递给它比如,假设你现在有个blog-post组件用来展示博客:app/templates/components/blog-post.hbs<article class=翻译 2017-07-08 23:32:07 · 253 阅读 · 0 评论 -
#4 为组件提供内容
英文原版:https://guides.emberjs.com/v2.14.0/components/wrapping-content-in-a-component/可能在有些时候,你或许需要你的组件包裹一些在其他模版中定义的内容。比如,假设现在你创建了一个blog-post组件,用来在应用中展示一篇博客:app/templates/components/blog-post.hbs<h1>{{tit翻译 2017-07-09 22:54:59 · 225 阅读 · 0 评论 -
#8 通过Actions触发变化
英文原版:https://guides.emberjs.com/v2.14.0/components/triggering-changes-with-actions/翻译 2017-07-17 22:55:31 · 357 阅读 · 0 评论