页面属性配置节点,用于指定页面的一些属性、监听页面事件。可部分替代pages.json的功能。 从微信基础库2.9.0开始,新增了page-meta组件,它是一个特殊的标签,有点类似html里的header标签。页面的背景色、原生导航栏的参数,都可以写在page-meta里。HBuilderX 2.6.3+ 支持了这个组件,并且全平台都实现了。 从某种意义...
-- HBuilderX 2.6.3+ 新增 page-meta, 详情:https://uniapp.dcloud.io/component/page-meta --><page-meta><navigation-bar/></page-meta><view><viewclass="status_bar"><!-- 这里是状态栏 --></view><view>状态栏下的文字</view></view></template><style>.status_bar{height:var(--status-...
小程序中的 page-meta 和 HTML 中的header设置meta比较类似,可以对页面的一些属性进行配置。 令人困惑的是,page-meta 的功能和 page.json 的功能及相关api的功能是重复的,提供page-meta这种方式,貌似只是一种语法糖,提供了另外一种风格。而且,page-meta 的执行效率还不如 page.json。 page-meta、page.json 及 ...
使用page-meta页面属性配置节点,用于指定页面的一些属性、监听页面事件。可部分替代pages.json的功能。 具体用法:https://uniapp.dcloud.io/component/page-meta <template> <page-meta> <navigation-bar :background-color="theme":title="nbTitle"/> </page-meta> <viewclass="match"v-if="showPage"> </v...
uni-app中修改根节点的样式,例如背景颜色、字体大小等样式。由于uni-app不能直接使用@media媒体监听来直接修改html的样式(我这里是需要修改html中的font-size,使用过page,@media都修改失败)。 经过多次尝试后发现uni-app官网推出的page-meta可以修改根节点的属性。具体方法如图 ...
在上述代码中,我们使用了 page-meta 组件来动态修改页面的 overflow 属性,通过绑定 show10 变量的值来控制页面的滚动。当 show10 为true 时,底层页面的滚动被禁止,从而解决了滚动穿透问题。 2. 禁止Popup内容区域的滚动穿透 注意:在h5平台可以通过动态修改body标签的样式,设置 overflow:hidden 即可解决滚动穿透,无循...
page-meta 的page-style属性相当于HTML的body属性,这个点很重要,之前我想要通过body{overflow:hidden;}的方式动态修改overflow的属性去停止页面的滚动,但是那时不知道怎么动态修改body的属性,而且如果使用document的方式去修改body的属性,在移动端真机会报错,拿不到body,真的很头疼,直到让我发现了page-st...
page-meta:页面配置节点,用于指定页面的一些属性、监听页面事件,类似于html中的header标签,可以部分替代pages.json的功能。 二、实现步骤 1.1 安装第三方插件 postcss-px-to-viewport npm install postcss-px-to-viewport --save-dev 1. 1.2 项目根目录创建postcss.config.js,并写入配置 ...
新功能描述 支持 page-meta 编写为独立组件而非必须在每个页面都写一遍 现状及问题 当应用涉及到皮肤、主题等色彩配置时,需凭借 page-meta 组件的能力来控制页面 backgroundColor、backgroundColorTop、backgroundColorBottom 等属性。一般来说开发者会使用 vuex / pinia
</div> </template> <script> export default { data() { return { footSize: this.$rootFontSize, } } } </script> 注意:<page-meta>需要放在页面的第一个标签。 问题汇总: 1.在uni-app框架中使用rem(h5和微信小程序) 2.index.html的设置...