Toast is not convenient

[helsonxiao]

• [x] I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

1. No more Portal for Toast removing（Toast 自带 show / hide 方法，不再引入 Portal 去 remove

   import { Portal, Toast } from '@ant-design/react-native'
   const key = Toast.loading('messsage')
   Portal.remove(key)

2. Real Optional Parameters（Toast 参数应该选填，同时做到 API 向后兼容，现在如果想要 mask = false，需要把前面的参数都传入进去

   Toast.info('Toast without mask !!!', 1, undefined, false);

What does the proposed API look like?

Toast.success({ content: 'hi', mask: true });
Toast.success('hi');

目前我直接加了一层进行适配

import { Toast as AntdToast } from '@ant-design/react-native';

interface IProps {
  content: string;
  duration?: number;
  onClose?: () => void;
  mask?: boolean;
}

// Order is important!
const defaultProps = new Map<keyof IProps, any>();
defaultProps.set('content', '');
defaultProps.set('duration', 2);
defaultProps.set('onClose', () => {});
defaultProps.set('mask', false);

const getAntdProps = (props: IProps | string) => {
  let _props = props as IProps;
  if (typeof _props === 'string') {
    _props = {
      content: _props,
    };
  }

  const propsMap = new Map(defaultProps);

  const antdProps: [
    string?,
    (number | undefined)?,
    ((() => void) | undefined)?,
    (boolean | undefined)?,
  ] = [];

  Array.from(propsMap.keys()).forEach(key => {
    antdProps.push(_props[key] || propsMap.get(key));
  });

  return antdProps as [
    string,
    (number | undefined)?,
    ((() => void) | undefined)?,
    (boolean | undefined)?,
  ];
};

const Toast = {
  success(props: IProps | string) {
    AntdToast.success.apply(null, getAntdProps(props));
  },
  fail(props: IProps | string) {
    AntdToast.fail.apply(null, getAntdProps(props));
  },
  info(props: IProps | string) {
    AntdToast.info.apply(null, getAntdProps(props));
  },
  loading(props: IProps | string) {
    AntdToast.loading.apply(null, getAntdProps(props));
  },
  offline(props: IProps | string) {
    AntdToast.offline.apply(null, getAntdProps(props));
  },
};

export { Toast };
export default Toast;

[helsonxiao]

顺便催一下 v4 ..

[BANG88]

这个Toast 比较古老，所以参数不能改了。 你可以自己做一层。 4.0 期待更多反馈啊，好像没什么人反馈。 我也不敢发布，毕竟是有breaking change的。

[helsonxiao]

这个Toast 比较古老，所以参数不能改了。 你可以自己做一层。 4.0 期待更多反馈啊，好像没什么人反馈。 我也不敢发布，毕竟是有breaking change的。

1. 能否这样处理，参数维持不变，只是第一个 content 参数既可以是 string 又可以是 object
2. 提供一个 Toast.config 来规范 Toast 的默认行为，从我们产品这边反馈的体验结果来看，默认 mask 为 false 体验更好一些
3. 已经升级了 4.0.0-3，目前体验下来，只有 Carousel 重构之后需要注意下 height，之前好像是默认撑满的。
4. 个人更期望 4.0 提供完善一些的样式/规范定制能力，碰到很多次样式变量不够用的情况，或是一些组件没有用规范里的变量。

[helsonxiao]

另外，@react-native-community/viewpager 这个库如果升级到 4.0，目前可能无法下载到，iOS 正常，编译安卓时报的错误就是下载不到，我降级到了 3.3.0 测试下来没问题。

Updates

用 maven { url 'https://jitpack.io' } 可解决

[BANG88]

@helsonxiao 有没有空来个PR。 看看 Toast的更改，我在加班中... 😢

[helsonxiao]

@helsonxiao 有没有空来个PR。 看看 Toast的更改，我在加班中... 😢

可以，估计下周。另外有个设想是，同时只能显示 1 个 Toast，叠加 Toast 的体验还蛮差的，这样在 Toast 里提供 remove/hide 方法也顺理成章。

[BANG88]

这个你建议加一个 Toast.config 的话我想你知道怎么做了。 哈哈 做成可配置的就谁也不会受伤害

[helsonxiao]

https://github.com/ant-design/ant-design-mobile-rn/pull/911 PR 了

[BANG88]

@helsonxiao

个人更期望 4.0 提供完善一些的样式/规范定制能力，碰到很多次样式变量不够用的情况，或是一些组件没有用规范里的变量。

这个具体指哪些地方

[BANG88]

其实 也不一定要发布4.0.0，只是react-native 拆分了很多组件，不得不发布一个 不兼容的版本。

[helsonxiao]

@helsonxiao

个人更期望 4.0 提供完善一些的样式/规范定制能力，碰到很多次样式变量不够用的情况，或是一些组件没有用规范里的变量。

这个具体指哪些地方

具体有点杂，我们在和 UI 确定规范的时候发现一些组件没有被你们的规范变量覆盖到，当时是看了几个组件的代码以后感觉不行，直接自己写了，我印象里 Input 这边变量问题比较多。具体的等我有时间看一下。

[wuazhu]

其实 也不一定要发布4.0.0，只是react-native 拆分了很多组件，不得不发布一个 不兼容的版本。

4.0 何时上线啊大佬。。。