Ember Hooks
This is an experimental addon that allows you to use react style hooks inside of ember. In theory this should allow you to create your Ember components without ever using the this keyword. Additionally I have wrapped the ember props in a proxy that handles getting and setting for you. This should allow you to just set and get like you would with normal objects. This is still WIP and experimental.
Javascript with default hooks:
import Component from '@ember/component';
import layout from '../templates/components/counter-with-hooks';
import EmberHooksMixin, { useProperties } from 'ember-hooks/mixins/ember-hooks';
export default Component.extend(EmberHooksMixin, {
layout,
hooks() {
// Use properties will automatically bind this data to your components scope
const state = useProperties({
count: 0,
});
// Note that you don't need to refer to this, instead you can mutate the values directly
const increment = () => {
state.count = state.count + 1;
}
// What gets returned here will bind to your component
return {
actions: {
increment,
}
};
}
});
Template
Same component using a custom hook:
import { withHooks } from "ember-hooks/mixins/ember-hooks";
import useCounter from "../hooks/useCounter";
// withHooks will return a component with the mixin already attached
// You can still pass in additional mixins as arguments before props
const CounterUsingWithHooksComponent = withHooks(props => {
// Explicitly deconstruct the values you want to use from the hook
const { count, increment } = useCounter();
return {
count,
actions: {
increment,
},
};
});
export default CounterUsingWithHooksComponent;
Installation
ember install ember-hooks
Usage
[Longer description of how to use the addon in apps.]
Contributing
Installation
git clone https://github.com/twaite/ember-hookscd ember-hooksyarn
Linting
yarn lint:hbsyarn lint:jsyarn lint:js -- --fix
Running tests
ember test– Runs the test suite on the current Ember versionember test --server– Runs the test suite in "watch mode"ember try:each– Runs the test suite against multiple Ember versions
Running the dummy application
ember serve- Visit the dummy application at http://localhost:4200.
For more information on using ember-cli, visit https://ember-cli.com/.
License
This project is licensed under the MIT License.
-
Ember检查器是一个浏览器插件，用于调试Ember应用程序。 灰烬检查员包括以下主题 - S.No. 灰烬检查员方式和描述 1 安装Inspector 您可以安装Ember检查器来调试您的应用程序。 2 Object Inspector Ember检查器允许与Ember对象进行交互。 3 The View Tree 视图树提供应用程序的当前状态。 4 检查路由，数据选项卡和库信息 您可以看到检查
-
英文原文: http://emberjs.com/guides/getting-ember/index/ Ember构建 Ember的发布管理团队针对Ember和Ember Data维护了不同的发布方法。 频道 最新的Ember和Ember Data的 Release，Beta 和 Canary 构建可以在这里找到。每一个频道都提供了一个开发版、最小化版和生产版。更多关于不同频道的信息可以查看博客
-
ember-emojione ember-emojione is your emoji solution for Ember, based on the EmojiOne project. EmojiOne version 2 is used, which is free to use for everyone (CC BY-SA 4.0), you're only required to giv
-
Ember 3D Ember 3D is an Ember addon for using Three.js - an easy to use, lightweight, javascript 3D library. It is designed to: Prescribe a solid file structure to Three.js code using ES6 modules. Ena
-
Ember Table An addon to support large data set and a number of features around table. Ember Table canhandle over 100,000 rows without any rendering or performance issues. Ember Table 3.x supports: Emb
-
vscode-ember This is the VSCode extension to use the Ember Language Server. Features All features currently only work in Ember-CLI apps that use classic structure and are a rough first draft with a lo
-
ember-headlessui This is a work-in-progress implementation of: https://github.com/tailwindlabs/headlessui A set of completely unstyled, fully accessible UI components for Ember.js, designed to integra
-
Ember Popper An Ember-centric wrapper around Popper.js. Currently an alpha in active development. See the dummy app for examples Compatibility Ember.js v3.12 or above Ember CLI v2.13 or above Node.js