Dialog和Toast函数形式无法使用

[zzzhangy]

NutUI React 包名

@nutui/nutui-react

NutUI React 版本号

2.6.4

平台

weapp

重现链接

https://github.com/jdf2e/nutui-react/issues/new?assignees=&labels=&projects=&template=bug_report_template.yml

重现步骤

官方文档直接粘贴过去都没用

期望的结果是什么？

出现弹窗

实际的结果是什么？

点击事件触发，弹窗未出现

环境信息

Binaries:
Node: 18.17.0 - E:\nvm\node.js\node.EXE
Yarn: 1.22.22 - E:\nvm\node_global\yarn.CMD
npm: 9.6.7 - E:\nvm\node.js\npm.CMD
npmPackages:
@tarojs/cli: 3.6.28 => 3.6.28
@tarojs/components: 3.6.28 => 3.6.28
@tarojs/helper: 3.6.28 => 3.6.28
@tarojs/plugin-framework-react: 3.6.28 => 3.6.28
@tarojs/plugin-html: 3.6.28 => 3.6.28
@tarojs/plugin-platform-alipay: 3.6.28 => 3.6.28
@tarojs/plugin-platform-h5: 3.6.28 => 3.6.28
@tarojs/plugin-platform-jd: 3.6.28 => 3.6.28
@tarojs/plugin-platform-qq: 3.6.28 => 3.6.28
@tarojs/plugin-platform-swan: 3.6.28 => 3.6.28
@tarojs/plugin-platform-tt: 3.6.28 => 3.6.28
@tarojs/plugin-platform-weapp: 3.6.28 => 3.6.28
@tarojs/react: 3.6.28 => 3.6.28
@tarojs/runtime: 3.6.28 => 3.6.28
@tarojs/shared: 3.6.28 => 3.6.28
@tarojs/taro: 3.6.28 => 3.6.28
@tarojs/taro-loader: 3.6.28 => 3.6.28
@tarojs/webpack5-runner: 3.6.28 => 3.6.28
babel-preset-taro: 3.6.28 => 3.6.28
eslint-config-taro: 3.6.28 => 3.6.28
react: ^18.0.0 => 18.3.1

其他补充信息

No response

[woshiji1987]

实际是可用的，但是要在顶层节点确保挂上一个固定的id，函数式调用的时候给上指定的id就可以，但是多次触发和销毁时机可能会带来不能正确隐藏的问题，猜测是内部duration相关的定时器或者挂在selector节点的逻辑存在点问题，最好是把duration定时器提到业务这一层封装起来，类似这样:

[Alex-huxiyang]

我看官网的demo是正常的，需要更详细的信息

[github-actions]

你好 @zzzhangy, 我们需要你提供一个在线的重现实例以便于我们帮你排查问题。你可以通过点击 此处 创建一个 codesandbox 或者提供一个最小化的 GitHub 仓库。请确保选择准确的版本。

[woshiji1987]

我看官网的demo是正常的，需要更详细的信息

因为官网是h5, 官网toast组件介绍最上面写着，taro内不能使用函数式调用，并且没有介绍在小程序内使用需要提前挂载一个dom节点

[zzzhangy]

我看官网的demo是正常的，需要更详细的信息

因为官网是h5, 官网toast组件介绍最上面写着，taro内不能使用函数式调用，并且没有介绍在小程序内使用需要提前挂载一个dom节点

对话框那里没写着不能使用，还是用不了，是不是也得像上面那样封装一层

[woshiji1987]

我看官网的demo是正常的，需要更详细的信息

因为官网是h5, 官网toast组件介绍最上面写着，taro内不能使用函数式调用，并且没有介绍在小程序内使用需要提前挂载一个dom节点

对话框那里没写着不能使用，还是用不了，是不是也得像上面那样封装一层

看Dialog文档入参介绍，open和close方法都有id入参，组件库源码里也有selector相关逻辑，https://github.com/jdf2e/nutui-react/blob/next/src/packages/dialog/dialog.taro.tsx
所以一样的方法应该都是可行的，参考上面toast再封装一层就好了，注意方法是open和close，跟toast有区别，并且不需要定时器逻辑

[crimson968]

确实存在这个问题，按照官方demo是无法使用的