Reactjs不允许dir=" RTL“显示文本RTL

Question

​

.rtl{
      direction: rtl;
     }

​

​

 <Col lg="9" md="8" sm="7">
                                    <div className="blog-details-box">
                                        <div className="blog-details-banner">
                                            <img src={process.env.PUBLIC_URL + `/assets/images/${Datas[blogId].postImg}`} alt="" className="img-fluid" />
                                        </div>
                                        <div className="heading" dir="rtl">
                                            <h4 className="rtl">{Datas[blogId].postTitle}</h4>
                                        </div>
                                        <div className="blog-auth_date d-flex">
                                           
                                        <div className="author-img d-flex">   
                                            <p><Link to={process.env.PUBLIC_URL + "/"}>{Datas[blogId].authorName}</Link></p>
                                      </div>
                                            <div className="post-date">
                                                <p><i className="las la-calendar"></i> {Datas[blogId].postDate}</p>
                                            </div>
                                           
                                        </div>


                                        <div className="blog-details-desc">
                                            <p> {Datas[blogId].postContent}</p>
                                           
                                        </div>
                                      
                                        

                                     
                                    </div>
                                </Col>

​

我只想在我的一个页面上显示一些乌尔都语文本。我已经尝试在我的计算机上应用dir="rtl“。

标签，但它不起作用。我尝试过使用react-with-direction，但它只改变了组件上所有项的位置，并没有改变文本本身的任何内容。现在，它看起来如下图所示，在此代码中，标记应以rtl显示文本

Answer 1

我使用了正确的文本对齐方式，但不确定这是否是一种好的做法。