uniapp - 属性记录

属性 --

box-sizing:border-box;允许你以某种方式定义某些元素,以适应指定区域。https://blog.youkuaiyun.com/sunraining1/article/details/111965768

position:https://blog.youkuaiyun.com/sunraining1/article/details/111965987

display:https://blog.youkuaiyun.com/sunraining1/article/details/111966095

flex:http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html

http://static.vgee.cn/static/index.html(更清楚的说明)

flex:0 : https://blog.youkuaiyun.com/qq_40138556/article/details/103967529

white-space: nowrap; 规定段落中的文本不进行换行:(开发中遇到v-for文字会换行,加上就不换行)

flex-wrap: wrap; 让弹性盒元素在必要的时候拆行: (开发中遇到v-for组件宽度不固定时不换行,加上就会换行)

 

 

 

### 实现 Web-View 组件的正确返回操作 在 UniApp 中处理 `web-view` 组件的返回逻辑时,可以利用 JavaScript 的历史记录管理功能以及 UniApp 提供的相关 API 来确保用户体验流畅。具体来说: 当用户点击设备上的物理回退按钮或应用内的关闭图标时,应该先判断当前 WebView 是否有可回退的历史记录。如果有,则执行浏览器内部的回退;如果没有,则按照默认行为退出页面。 #### 判断并控制WebView内页回退 为了实现上述需求,在 Vue 页面中可以通过监听原生事件 `onBackPress` 和调用 `webView.canGoBack()` 方法来完成这一过程[^1]。 ```javascript // 在Vue页面中的methods里定义如下函数 handleBackButton() { const webViewRef = this.$refs.webview; // 获取webview组件实例 if (webViewRef && webViewRef.canGoBack()) { // 如果能后退则执行后退动作 webViewRef.goBack(); return true; } else { // 当前页面无更多浏览记录, 可以选择关闭当前窗口或其他自定义操作 uni.navigateBack({ delta: 1 }); return false; } } ``` 需要注意的是,以上代码片段假设已经给 `<web-view>` 设置了一个 ref 属性用于获取其 DOM 节点对象[^2]。 此外,还需要注册全局的 backpress 事件处理器以便捕获用户的返回按键输入: ```javascript import { onMounted, onUnmounted } from 'vue'; export default { setup() { function handleHardwareBackButton(e) { e.preventDefault(); // 阻止默认行为 let handled = handleBackButton(); if (!handled){ plus.runtime.quit(); // 或者其他方式结束程序/页面 } } onMounted(() => { document.addEventListener('backbutton', handleHardwareBackButton); }); onUnmounted(() => { document.removeEventListener('backbutton', handleHardwareBackButton); }); ... }, }; ``` 这段脚本会在组件挂载完成后添加对硬件返回键的支持,并且在卸载之前移除该监听器,从而避免内存泄漏的风险。 通过这种方式可以在不影响原有业务流程的前提下优雅地处理来自不同方向(即前端路由变化和Web视图导航)的返回请求。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值