收藏
回答

如何动态修改page{}样式?

问题模块
API和组件

请问如何动态修改*.wxss里面page{}样式呢?wxml里面也不可以改变page样式,只能改变某组件的样式,假如改变整个页面的背景,如何在js动态?

最后一次编辑于  2017-12-06  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答

11 个回答

  • June
    June
    2017-12-06

    想问一下为何会有动态修改page样式的场景呢?一般这种情况可以在页面最外层套一个view,宽高和page一样,通过修改这个view的样式应该就能实现。

    2017-12-06
    赞同
    回复
  • 梁潇
    梁潇
    2017-12-06

    view里面假如我想改变整个页面的背景颜色的话,只能自适应view里面内容高度的背景颜色,我的需求是整个页面的背景颜色,这个好像只能page{}里面设置

    2017-12-06
    赞同
    回复
  • 梁潇
    梁潇
    2017-12-06

    如何使view和page宽高一样?

    2017-12-06
    赞同
    回复
  • 梁潇
    梁潇
    2017-12-06

    如果是将page{height:100%},.view {height:100%}的话,也只能是当前屏幕的高度,下拉被覆盖那块没效果。。。

    2017-12-06
    赞同
    回复
  • June
    June
    2017-12-06

    不太清楚你描述的场景,能否贴个简单的demo代码看看?

    2017-12-06
    赞同
    回复
  • 梁潇
    梁潇
    2017-12-06

    就是我希望点击按钮,能把页面背景颜色替换。用view定义同page高度100%的话,也只能改变当前屏幕高度的颜色,也就是说,假如我这个背景还能下拉的话,下拉被遮挡那块颜色就没替换掉

    最有效的方法就是改变page的背景颜色,但貌似在js里面没办法控制到page{}

    2017-12-06
    赞同
    回复
  • June
    June
    2017-12-06

    可以的,将page的overflow设置为hidden,外面层和page等高的view的overflow设置为auto即可。


    这种做法和传统网页做法一样。

    2017-12-06
    赞同
    回复
  • 梁潇
    梁潇
    2017-12-06

    好谢谢,解决了

    2017-12-06
    赞同
    回复
  • 祺爸💎
    祺爸💎
    2017-12-06

    不要用这种方法,我试过,效果很差,特别是上下滚动页面的时候很不流畅


    另外从逻辑上来说,既然page和其他组件一样可以通过wxss来设置样式,就应该允许动态修改


    再来一点,比如page的背景色是可以在page.json里设置的,同样是page.json里的设置项,页面标题是可以动态修改的,那从逻辑上来说,背景色也应该可以动态修改才说得过去吧

    2017-12-06
    赞同
    回复
  • 梁潇
    梁潇
    2017-12-06

    刚用手机测试了一下,确实会出现页面滚动卡顿的问题,overflow的问题。。。。

    2017-12-06
    赞同
    回复