平板设备上访问应用内页面时出现请用手机访问的弹窗

问题现象

使用平板打开应用，在跳转部分二级页面时，出现请用手机访问的弹窗。

背景知识

• promptAction：可创建并显示文本提示框、对话框和操作菜单。
• 媒体查询中的媒体特征可实现查询当前设备的类型device-type。

问题定位

1. 对比平板上出现弹窗和不出现弹窗页面的区别，出现弹窗和不出现弹窗的页面组件不一致，表明采用的是两个页面。
2. 查阅跳转到出现弹窗页面的代码逻辑中是否针对设备类型为tablet做了弹窗适配，例如下面代码。
   收起

   自动换行

   深色代码主题

   复制

   import { mediaquery } from '@kit.ArkUI';
   
   @Entry
   @Component
   struct MediaQueryExample {
     @State text: string = 'Portrait';
     // 当设备为tablet类型时条件成立
     listener: mediaquery.MediaQueryListener = this.getUIContext().getMediaQuery().matchMediaSync('(device-type: tablet)');
   
     build() {
       Column({ space: 50 }) {
         Text(this.text).fontSize(50)
           .onClick(() => {
             if (this.listener.matches) {
               this.getUIContext().getPromptAction().showToast({
                 message: '请用手机访问',
                 duration: 1500
               });
             }
   
             // 跳转到详情页
           });
       }
       .width('100%').height('100%');
     }
   }

分析结论

应用代码中，针对tablet类型的设备，在部分二级页面跳转时设置了请用手机访问的弹窗，怀疑是当初tablet类型设备适配时，股票详情页未开发时添加的友好弹窗。

修改建议

建议在功能实现后及时删除友好提示弹窗代码。

@Entry
@Component
struct MediaQueryExample {
  private text: string = 'Portrait';

  build() {
    Column({ space: 50 }) {
      Text(this.text).fontSize(50)
        .onClick(() => {
          // 跳转到详情页
        });
    }
    .width('100%').height('100%');
  }
}