van-action-sheet如何在组件中使用?

微信问答 文章 2021-12-01 17:20 2150 0 全屏看文

AI助手支持GPT4.0

van-action-sheet如何在组件中使用?How to use van-action-sheet in components?

van-action-sheet如何在组件中使用?

放在page中是没有问题的,但是如果放在组件中就出问题了,不是从底部弹出的。求教!

There is no problem putting it in the page, but there is a problem if it is placed in the component, which is not popped from the bottom. Ask for advice!

鍥炵瓟锛�

Junwei:

这个用例感觉还是挺普遍的,有些组件可能确实需要承担一些全局的action-sheet,如果action-sheet必须写在page中才能实现底部弹出,那么就存在两个问题:

  1. 如果业务逻辑比较复杂,page中可能需要组件内部的数据才能渲染这个action-sheet,数据怎么传递?而且响应函数放在page中也不是一个很好的解决办法。
  2. 如果组件嵌套关系比较复杂,使用action-sheet的组件可能被嵌套了好几层,这样再传到page就更麻烦了,代码会惨不忍睹。


求教大神!跪谢!

青寒:

关注

青团社:

你自己的组件是否是 fixed定位的。

Junwei:不是fixed定位的
青团社:那组件内引用action-sheet是以组件为父容器。
Junwei:那有办法破解吗?还是一定要把组件变成fixed定位?
青团社:transform属性好像是可以改组件的fixed为absolute
青团社:算了。你还是自己写个组件吧。放到父组件。子组件triggerEvent通知Page页面调用。
Junwei:我试了一下好像把组件变成fixed也不行
青团社:算了。你还是自己写个组件吧。放到Page页面。子组件triggerEvent通知Page页面调用。
Junwei:自己写的存在一个很大的问题,如果业务逻辑比较复杂,page中需要组件内部的数据才能渲染这个action-sheet,而且响应函数放在page中也不是一个很好的解决办法。
Junwei:而且如果组件嵌套关系比较复杂,最底层的组件可能被嵌套好几层,这样再传到page就更麻烦了
青团社:多层传递参数 这个看下自定义组件的relations属性。

-EOF-

AI助手支持GPT4.0