set-page-backgroundColorContent.uvue 779 B

1234567891011121314151617181920212223242526272829303132333435
  1. <template>
  2. <view class="container" @click="changeColor">
  3. <text>点击切换页面容器颜色</text>
  4. </view>
  5. </template>
  6. <script>
  7. export default {
  8. data() {
  9. return {
  10. isChange: false,
  11. currentBackgroundColorContent: "" as any | null
  12. }
  13. },
  14. methods: {
  15. changeColor() {
  16. let pages = getCurrentPages()
  17. let page = pages[pages.length - 1]
  18. page.setPageStyle({ "backgroundColorContent": this.isChange ? "" : "red" })
  19. this.isChange = !this.isChange
  20. let pageJson = page.getPageStyle()
  21. this.currentBackgroundColorContent = pageJson["backgroundColorContent"]
  22. }
  23. }
  24. }
  25. </script>
  26. <style>
  27. .container {
  28. flex: 1;
  29. align-items: center;
  30. justify-content: center;
  31. }
  32. </style>