我正在将 RTL 合并到我的 React 应用程序中。我有两个 CSS 文件，一个用于 LTR，一个用于 RTL。我有一个下拉菜单，用户可以从中选择英文版或阿拉伯文版。
我对如何在用户选择阿拉伯语版本时有条件地导入我的 RTL CSS 文件并在用户选择英语时恢复到正常的 CSS 文件感到困惑。
对此的任何帮助或指导将不胜感激
我正在使用 React 和 webpack
问候
react RTL。条件导入 CSS
IT技术
css
reactjs
right-to-left
2021-04-06 20:14:09
2个回答
我以前遇到过这个问题，我所做的是当我的主容器安装时，我检查语言，如果它是阿拉伯语，我需要阿拉伯语 CSS 文件，如果不是我需要另一个。
例子：
class Main extends Component {
componentWillMount() {
if(this.props.language === 'ar') {
require('arabic.css');
} else {
require('english.css');
}
}
}
我也在使用 Redux，这让我更容易获得初始或默认语言，并相应地更改所有其他组件。
只要确保在 webpack 配置文件中配置了 CSS 加载器。
使用 React.Lazy 和 React.Suspense 有条件地导入它们。