简介
@themarshalsgroup/ember-ui 是一个 Ember.js UI 组件库,其中包含了按钮、输入框、下拉框等常用的 UI 组件。
使用该包可以在 Ember.js 项目中快速搭建 UI 界面,提高开发效率。
安装
首先,需要安装 Node.js 和 npm。可以在 Node.js 官网 下载安装包。
在终端中执行以下命令安装 @themarshalsgroup/ember-ui 包:
--- ------- --------------------------
使用
引入组件
在需要使用组件的地方引入组件,例如:
------ - ------ - ---- -----------------------------
组件列表
@themarshalsgroup/ember-ui 包含以下组件:
Button
------ - ------ - ---- ----------------------------- ------- ------------ ---- --
该组件用于展示一个按钮。
参数 | 类型 | 说明 |
---|---|---|
text | string | 按钮上的文本 |
onClick | function | 点击按钮时的回调函数 |
Input
------ - ----- - ---- ----------------------------- ------ -------------------- ----- ---- ----- --
该组件用于展示一个输入框。
参数 | 类型 | 说明 |
---|---|---|
placeholder | string | 输入框中的提示文本 |
onChange | function | 输入框内容变化时的回调函数 |
Select
------ - ------ - ---- ----------------------------- ------- ------------------------- --
该组件用于展示一个下拉框。
参数 | 类型 | 说明 |
---|---|---|
options | array | 下拉框中选项的数组 |
value | string | 下拉框中选中的值 |
onChange | function | 下拉框选中值改变时的回调函数 |
示例代码
下面是一个完整的示例代码:
------ --------- ---- --------------------- ------ - ------ - ---- ---------------- ------ - ------- ------ ------ - ---- ----------------------------- ------ ------- ----- ----------- ------- --------- - ------- - - - ------ -------- ------ ------- -- - ------ --------- ------ -------- -- - ------ --------- ------ -------- -- -- ---------- - --- ------- ------------------- - ------------------- ---------- - ------- ------------------------ - --------------- - ------ - ------- ------------------------- - ------------------------ ------- - --- ---------------- - ------ ------------------------ -- ------------ --- ----------------- - --- ------------- - ------ ------------------- - ------------------------- - ---------- - ------- ------------------ - --------------- - --- ------------------ ---------- - --- ----------------- - ------ -------------------------- -- ---------------------------------------- - --- --------------- - ------ ------------------------------- -- -- ------ ------------- ------ -------------------------- ---- - -
------- ------------ ---- ----------------------------------- -- ------ -------------------- ----- ---- ----- ------------------------------------ -- ------- ------------------------------- --------------------------- ------------------------------------- -- ------- ------------- ---------------------------------- --
总结
@themarshalsgroup/ember-ui 是一个实用的 UI 组件库,可以提高 Ember.js 项目的开发效率。本文介绍了该组件库的安装、使用以及组件列表,并提供了示例代码。希望本文能对读者有所帮助。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/60055ca081e8991b448da056