Mint 是面向前端开发的编程语言，旨在从语言层面解决编写单页应用 (Single Page Application, SAP) 的常见问题。例如：

• 可复用组件
• 全局和局部状态处理
• 同步和异步计算
• 样式
• 路由

Mint 可帮助开发者编写无错误、易于阅读和可维护的应用程序。

语法示例

样式

在 Mint 语言中，支持使用style块直接用 CSS 来为元素设置样式。

component TodoItem {
  property color = "#333"
  property label = ""
  property done = false

  style base {
    align-items: center;
    display: flex;
  }

  style label {
    font-weight: bold;
    color: #{color};
    flex: 1;

    if (done) {
      text-decoration: line-through;
    }
  }

  fun render {
    <div::base>
      <span::label>
        <{ label }>
      </span>

      <Icon.Checkmark/>
      <Icon.Trash/>
    </div>
  }
}

数据管理

Mint 语言的store包含并用于管理数据，store具有全局访问属性，并且可以连接到组件。当store的数据发生变化时，连接的组件会被重新渲染。

record Todo {
  label : String,
  done : Bool
}

store Todos {
  property items = [] of Todo

  fun add (todo : Todo) {
    next { items = Array.push(todo, items) }
  }

  fun delete (todo : Todo) {
    next { items = Array.delete(todo, items) }
  }
}

component TodoList {
  connect Todos exposing { add, delete }

  ...
}

路由

Mint 语言中的路由是一项语言特性而不是工具库，路由可在routes块中进行定义，并支持类型化的路径参数。

routes {
  / {
    Application.setPage(Page::Home)
  }

  /blog {
    Application.setPage(Page::Blog)
  }

  /blog/:slug (slug : String) {
    sequence {
      Posts.load(slug)
      Application.setPage(Page::Post)
    }
  }

  * {
    Application.setPage(Page::NotFound)
  }
}

与 JavaScript 的互操作性

使用`...`语法即可内嵌任何 JavaScript 代码。

module MyFunctions {
  fun alert(message : String) : Promise(Never, Void) {
    `
    (new Promise((resolve) => {
      alert(#{message})
      resolve()
    })()
    `
  }

  fun decode : Maybe(TodoItem) {
    try {
      object =
        `{ label: "Check out Mint!",
           done: false }`

      result =
        decode as TodoItem

      Maybe::Just(result)
    } catch {
      Maybe::Nothing()
    }
  }
}