Skip to content

add {#await promise} #228

Description

@nanokind

对于一些异步操作,往往需要定义一些临时变量在模板中,来表示异步操作当前的状态

类似这样

{#if pending}
  loading
{#elseif failed}
 { error }
{#else}
 { response }
{/if}
Regular.extend( {
  // ...
  async request() {
    this.data.pending = true
    this.data.failed = false
    this.$update()
    
    try {
      this.data.response = await request( ... )
    } catch ( e ) {
      this.data.failed = true
      this.data.error = e.message
    }

    this.data.pending = false
    this.$update()
  }
} )

当存在多个异步操作的情况下会更加麻烦,this.data上要新增很多临时变量,还要避免变量间的命名冲突,很容易产生bug

有了 await 命令之后:

{#await promise}
  loading
{#then response}
  { response }
{#catch e}
  { e.message }
{/await}

模板就可以拥有这种能力

btw:如果regular能把自定义{#command}的能力开放给开发者的话,会是一个很大的亮点

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions