Smart UI Dialog DialogInstance.input 支持 onInputChange 方法

[summer_tree]

Code: Select all

import React from 'react';
import { DialogInstance, Dialog, Button } from '@ray-js/smart-ui';

const beforeClose = (action: 'confirm' | 'cancel' | 'overlay', value?: string): Promise<boolean> => {
  return new Promise((resolve) => {
    if (action === 'confirm') {
      // 不存在输入值则拦截确认操作
      resolve(!!value);
    } else {
      resolve(true);
    }
  });
}   

export default function Demo() {
  const open = () => {
    DialogInstance.input({
      title: 'Title',
      value: '',
      beforeClose,
      emptyDisabled: true,
      cancelButtonText: 'Sub Action',
    })
      .then(() => {
        // on confirm
      })
      .catch(() => {
        // on cancel
      });
  }
  return (
    <>
      <Dialog id="smart-dialog" />
      <Button onClick={open}>点击展示</Button>
    </>
  )
}

Smart UI Dialog DialogInstance.input 是否支持 onInputChange 方法来监听输入的值来做一些判断逻辑, 如果目前不支持, 请问有可以替代的组件吗

[xiaoqi]

你是需要监听来判断什么 这个弹框是聚焦整个页面的，也就是用户同一时间只能操作这个弹框
你可以统一在 beforeClose 回调内来判断 输入框的值，或者来做一些判断的逻辑

[summer_tree]

你是需要监听来判断什么 这个弹框是聚焦整个页面的，也就是用户同一时间只能操作这个弹框
你可以统一在 beforeClose 回调内来判断 输入框的值，或者来做一些判断的逻辑

需求要求输入时可以判断输入的字符是中文还是英文, 然后就中文和英文分别限制不同的输入字符长度
比如输入的全是中文, 最多可以输入 8 个; 输入的全是英文, 最多可以输入 10 个字符; 以上 2 中都不是, 最多输入 6 个字符

因为需求要求是input change 时就判断, 所以 beforeClose 回调不适用

[xiaoqi]

这种情况你也没办法动态的限制他的输入长度呀
建议是 dialog 组件方式调用，自己插入一个input 组件去控制

[xiaoqi]

Api 方式调用Dialog 在你打开弹框的时候 所有的参数就已经固定了 没办法动态的去修改 参数 ，只能重新打开弹框才可以修改参数

[summer_tree]

这种情况你也没办法动态的限制他的输入长度呀
建议是 dialog 组件方式调用，自己插入一个input 组件去控制

好的, 那我用组件方式来实现, 感谢