index.vue 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. <template>
  2. <view class="u-demo">
  3. <view class="u-demo-wrap">
  4. <view class="u-demo-title">演示效果</view>
  5. <view class="u-demo-area">
  6. <view class="u-no-demo-here">
  7. 通过压窗屏打开的模态框,可以遮盖顶部原生的导航栏和底部tabbar栏。
  8. 注意:压窗屏只对APP有效,其他端无效。
  9. </view>
  10. </view>
  11. </view>
  12. <view class="u-config-wrap">
  13. <view class="u-config-title u-border-bottom">
  14. 参数配置
  15. </view>
  16. <view class="u-config-item">
  17. <view class="u-item-title">状态</view>
  18. <u-subsection :current="current" :list="['打开', '关闭']" @change="openModal"></u-subsection>
  19. </view>
  20. </view>
  21. </view>
  22. </template>
  23. <script>
  24. export default {
  25. data() {
  26. return {
  27. current: 1
  28. }
  29. },
  30. onShow() {
  31. this.$nextTick(() => {
  32. this.current = 1;
  33. })
  34. },
  35. methods: {
  36. openModal(index) {
  37. // 可以传递参数
  38. if(index == 0) {
  39. this.$u.route("/uview-ui/components/u-full-screen/u-full-screen?id=1");
  40. }
  41. }
  42. }
  43. }
  44. </script>
  45. <style lang="scss" scoped>
  46. .u-demo {}
  47. </style>