[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"$futYDqk58nNZsMNC9nD-_NLKaT63OEe-OqDTWUCC25kY":3},{"code":4,"message":5,"data":6},200,"成功",{"id":7,"createdAt":8,"title":9,"content":10,"summary":11,"image":12,"uid":13,"user":14,"categoryId":21,"category":22,"subCategoryId":24,"subCategory":25,"comments":27,"status":17,"reason":12,"notice":12,"visitCount":28,"commentCount":29,"keywords":30},122,"2024-08-18T09:04:47.117Z","网页外观主题色-如何监听系统appearance主题色的改变","自从Apple公司推出系统外观深色、浅色主题色的切换后，大多数的pc、mobile的app也都支持主题色的修改，进而发展到浏览器的主题色也可以进行修改，网页也就可以随着主题色颜色的切换变得更加丰富。\n\n\n那么我们怎么在js中监听系统主题色的改变呢？\n\n```js\nconst listenForColorSchemeChanges = () => {\n\t  darkModeMediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n\t  darkModeMediaQuery.addEventListener('change', event => {\n\t        if (event.matches) {\n\t           console.log(\"Switched to dark mode (black style).\");\n\t        } else {\n\t           console.log(\"Switched to light mode (white style).\");\n\t        }\n\t  });\n}\n```","自从Apple公司推出系统外观深色、浅色主题色的切换后，大多数的pc、mobile的app也都支持主题色的修改，进而发展到浏览器的主题色也可以进行修改，网页也就可以随着主题色颜色的切换变得更加丰富。","",499668042977349,{"phone":15,"userId":13,"nickName":16,"vipType":17,"avatar":18,"sign":19,"createdAt":20},"13121171998","全栈老韩",1,"https://image.xinwei.ltd/images/IMG_5430.JPG","全栈工程师，擅长iOS App开发、前端（vue、react、nuxt、小程序&Taro）开发、Flutter、React Native、后端（midwayjs、golang、express、koa）开发、docker容器、seo优化等。","2024-01-01T16:14:30.305Z",2,{"id":21,"name":23},"IT技术",32,{"id":24,"name":26,"parentId":21},"前端",[],389,0,"apple web,apple web color,apple appearance,apple web appearance,apple website,website color,ios web color"]