我正在使用App.tsx文件通过react-router在我的应用中打开不同的页面。每个页面在标签scss，html和body的特定div#root文件中指定了不同的样式属性。样式属性为background，display，font等。但是由于我将所有页面导入到App.tsx中，因此html的样式属性为{ {1}}和body在所有页面上都相同。如何避免这个问题？仅当路由器打开特定页面时，如何才能导入div#root文件？
这里是我的应用程序的一个小演示。每个页面的scss应该有不同的background-color：