baidu / amis

前端低代码框架,通过 JSON 配置就能生成各种页面。
https://baidu.github.io/amis/
Apache License 2.0
17.45k stars 2.53k forks source link

javascript方法,打开AMIS的dialog,好像toast,怎么实现? #10855

Open wanquantong opened 3 months ago

wanquantong commented 3 months ago

实现场景:

javascript方法,打开AMIS的dialog,好像toast,怎么实现?相关文档在哪? 我想用javascript调用,toast是可以用的,但dialog要怎么实现呢? function tips() { amisLib.toast.info('消息通知'); }

存在的问题:

https://aisuda.bce.baidu.com/amis/zh-CN/docs/extend/ui-library 使用 amis 公共方法 具体有哪些可以参考 https://github.com/baidu/amis/blob/master/src/index.tsx 这个链接打不开!

当前方案:

就像toast方法,amisLib.toast.info('消息通知'); 是可以用的。

let amis = amisRequire('amis/embed');
let amisLib = amisRequire('amis');
let amisScoped = amis.embed('#root', {
  type: 'page',
  title: '表单页面',
  body: {
    type: 'form',
    mode: 'horizontal',
    api: '/saveForm',
    body: [
      {
        type: 'button',
        label: '按钮',
        onClick: () => {
          amisLib.toast.info('消息通知');
        }
      }
    ]
  }
});
github-actions[bot] commented 3 months ago

👍 Thanks for this! 🏷 I have applied any labels matching special text in your issue.

Please review the labels and make any necessary changes.

2betop commented 3 months ago

https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/event-action#toast-%E6%8F%90%E7%A4%BA 用这个动作就能弹出

wanquantong commented 3 months ago

https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/event-action#toast-%E6%8F%90%E7%A4%BA 用这个动作就能弹出

我想用javascript调用,toast是可以用的,但dialog要怎么实现呢? function tips() { amisLib.toast.info('消息通知'); }

2betop commented 3 months ago

弹窗没有功能方法可以弹出,应该类似这样去用 component <Modal show={this.state.show} onClose={handleClose}><p>Contdents</p></Modal>

lhtuling commented 2 months ago

你如果是强提示用alert和confirm可以 其他的你可能思路不对了,换方式吧不应该这样用!

image

image

lhtuling commented 2 months ago

Amis低代码前端框架交流群【QQ1群】:717791727 Amis低代码前端框架交流群【QQ2群】:721182449

wanquantong commented 2 months ago

你如果是强提示用alert和confirm可以 其他的你可能思路不对了,换方式吧不应该这样用!

image

image

我是想用JS代码触发打开AMIS的某一个dialog,可以实现吗?

lhtuling commented 2 months ago

我是想用JS代码触发打开AMIS的某一个dialog,可以实现吗?

测了下可以的,比较绕一点,首先用definitions定义弹窗 然后通过暴露的amisScoped调用弹窗窗口方法就行了,也是个解决方法

Amis低代码前端框架交流群【QQ 1群】:717791727 Amis低代码前端框架交流群【QQ 2群】:721182449

wailovet commented 1 month ago

可以试一下

amisScoped.doAction({actionType:"drawer",drawer:{"title": "抽屉标题", "body": "这是一个抽屉"}})