48

一个月过去后，Umi UI 怎么样了

 4 years ago
source link: https://github.com/sorrycc/blog/issues/89
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

68747470733a2f2f63646e2e6e6c61726b2e636f6d2f79757175652f302f323031392f706e672f38363032352f313537343134353634303430382d30643635306266312d366566332d343864612d383432662d6261386661363638313566662e706e67

我们今天发布了 Umi UI 三期，对外部分的功能包括 Dashboard 定制化、Terminal、资产市场信息架构调整、布局区块等。

68747470733a2f2f63646e2e6e6c61726b2e636f6d2f79757175652f302f323031392f706e672f38363032352f313537343134353634303730392d39333466656365662d636265382d343130312d393661332d3633313635643532656564322e706e67

定制化的 Dashboard 和插件接口

Dashboard 作为项目入口，提供的功能卡片支持定制，内置的卡片陆续添加中，目前有配置入口、任务入口和前端早报。

68747470733a2f2f63646e2e6e6c61726b2e636f6d2f79757175652f302f323031392f6769662f38363032352f313537343134353634313033322d35636330363838332d333530662d346462322d383734312d3133666564326561316233372e676966

同时，还提供了 插件接口 ，允许在插件添加属于自己的卡片。比如： 

api.addDashboard({
  key: 'org.umi.dashboard.card.testId',
  title: '卡片标题',
  description: '卡片描述',
  icon: <ControlFilled />,
  content: [
    <a onClick={() => alert('部署成功')}>
      一键部署
    </a>,
  ],
});

Terminal（终端）

添加 Terminal 功能是为了让 Umi UI 形成闭环，用户无需离开 Umi UI 即可完成代码提交等操作，这是对 Umi UI 功能的重要补充。

68747470733a2f2f63646e2e6e6c61726b2e636f6d2f79757175652f302f323031392f6769662f38363032352f313537343134353634313431352d30366339626465372d303166392d343463652d383962392d3235616635613836643330392e676966

资产市场信息结构调整

我们还对资产市场的组织形式进行了调整，把 tag 换成了类别，并把标题上移减少了一层结构，希望通过这种方式能让资产查找更加容易。

68747470733a2f2f63646e2e6e6c61726b2e636f6d2f79757175652f302f323031392f6769662f38363032352f313537343134353634313830312d63363866633533332d623839652d346239382d623237322d3333646134323662363765322e676966

布局区块

我们在原来的区块基础上新增了一种特殊的区块类型：布局区块。布局区块提供了 占位的能力 ，我们可以在指定位置添加其他区块；并且会 通过代码合并的方式添加到目标文件中 ，这点更加符合代码组织的直觉。

68747470733a2f2f63646e2e6e6c61726b2e636f6d2f79757175652f302f323031392f6769662f38363032352f313537343134353634323731322d34656638663065302d623833352d343633382d616336382d3732336163303736393533352e676966

通常每个页面通常都需要有布局，所以开发者开发页面时可以先添加布局区块，再添加普通区块。

68747470733a2f2f63646e2e6e6c61726b2e636f6d2f79757175652f302f323031392f706e672f38363032352f313537343134353634323932362d63376465333632612d336466322d343633322d383134372d3866316133363665623230312e706e67

现在内置了圣杯布局和左右两栏布局，欢迎大家 提交更多的 。

参考


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK