UNI_App平台调试指南 debug(十五)

App平台调试指南 debug

常规开发里,在 HBuilderX 的运行菜单里运行 App,手机端的错误或 console.log 日志信息会直接打印到控制台。

如果需要更多功能,比如审查元素、打断点 debug,则需要启动调试模式。自 HBuilderX 2.0.3+ 版本起开始支持 App 端的调试。

#打开调试窗口

在 HBuilderX 中,正确运行项目: 运行 --> 运行到手机或模拟器 --> 选择设备,项目启动后,在下方的控制台选择 debug 图标。

debug

正确打开调试窗口后,显示如下: 

debug

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
uni_app中的选项卡可以通过使用uni-app官方提供的组件 `uni-tab-bar` 来实现。该组件可以在底部或顶部显示多个选项卡,用户可以通过点击不同的选项卡来切换不同的页面。 使用 `uni-tab-bar` 组件可以通过以下步骤实现: 1. 在页面的 `template` 中添加 `uni-tab-bar` 组件,并设置 `tabList` 属性,指定选项卡的列表。 2. 在每个选项卡对应的页面中,添加 `tabBar` 属性,指定该页面对应的选项卡的索引值。 3. 在 `App.vue` 中设置 `tabBar` 属性,指定默认选中的选项卡的索引值,以及点击选项卡后的处理函数。 例如,以下示例代码实现了一个包含两个选项卡的底部选项卡菜单: ```html <template> <view> <view> <text>这是第{{activeIndex+1}}个页面</text> </view> <uni-tab-bar :tabList="tabList" @click="onTabBarClick" :active="activeIndex"> </uni-tab-bar> </view> </template> <script> export default { data() { return { activeIndex: 0, tabList: [ { pagePath: "/pages/tab1/tab1", text: "选项卡1", iconPath: "/static/tab1.png", selectedIconPath: "/static/tab1_selected.png" }, { pagePath: "/pages/tab2/tab2", text: "选项卡2", iconPath: "/static/tab2.png", selectedIconPath: "/static/tab2_selected.png" } ] }; }, methods: { onTabBarClick(e) { this.activeIndex = e.index; } } }; </script> ``` 在每个选项卡对应的页面中,需要设置 `tabBar` 属性,例如: ```html <script> export default { tabBar: { index: 0 } }; </script> ``` 其中,`index` 表示该页面对应的选项卡的索引值。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

A_nanda

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值