ant design 中如何调整基于多语言的 Form 项中的搜索字段组件的文字方向？

Question

我想根据用户输入的语言自动调整搜索字段中的文本方向。 例如，如果他用阿拉伯语输入，则将文本方向切换为

rtl

；如果他用英语输入，则将文本方向切换为

ltr

。

如何在能够读取提交表单时所选值的同时实现此目的？

我尝试将选择组件包装在 div 中并在其上应用

dir

属性，效果很好，但最终使所选值未定义。

此外，在选择组件上应用

direction

css 规则可以工作，但不会自动更改，因此如果用户输入英语，即使他随后输入阿拉伯语，它也会变成并保持

ltr

这是codesandbox。

Answer 1

//there is a lot of solutions with js & internalization libraries but there is an easy way to do it with css
//align text automatically to right or left based on text direction
.autoInput {
 unicode-bidi: plaintext;
 text-align: start; //optional
}