weibaohui / BlazorAmis

使用Blazor集成百度Amis框架

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

BlazorAmis

使用Blazor 集成 百度Amis低代码平台 BlazorServer版本 BlazorWasm版本

官方Amis页面

文档 示例 可视化编辑器 仓库

特性

百度Amis使用json表达页面及功能。

Blazor 可以使用 C# 匿名类进行json的对等表达。

Blazor + Amis = 生产效率大幅提升

项目进展

  1. 官方示例移植
  2. 接口移植
  3. json的定义上使用了匿名类的方式进行表达,非常符合c#使用习惯
  4. 有两个json配置超长的页面移植进展90%,尚未完成

#体验

docker run -it --rm -p 7777:8080 ghcr.io/weibaohui/blazoramis

访问7777端口

使用

<Amis Obj="GetObj()"></Amis>
 return new
        {
            type = "page",
            title = "表单页面",
            body = new
            {
                type = "form",
                mode = "horizontal",
                api = "/saveForm",
                body = new[]
                {
                    new { label = "Name", type = "input-text", name = "name" },
                    new { label = "Email", type = "input-email", name = "email" }
                }
            }
        };

原始JSON

var json={
          type: 'page',
          title: '表单页面',
          body: {
            type: 'form',
            mode: 'horizontal',
            api: '/saveForm',
            body: [
              {
                label: 'Name',
                type: 'input-text',
                name: 'name'
              },
              {
                label: 'Email',
                type: 'input-email',
                name: 'email'
              }
            ]
          }
        }

展示效果

About

使用Blazor集成百度Amis框架


Languages

Language:C# 55.3%Language:HTML 29.5%Language:CSS 14.9%Language:JavaScript 0.3%Language:Dockerfile 0.0%