第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全，請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題，去搜搜看，總會(huì)有你想問的

React 如何獲取和觀察正文方向

React 如何獲取和觀察正文方向

犯罪嫌疑人X 2023-05-11 14:13:47
所以我正在構(gòu)建一個(gè)需要支持文本方向（ltr和rtl）的組件在主頁(yè)面中，我們使用簡(jiǎn)單的 HTML 和 CSS 來確定文本方向<div data-testid="mountNode" id="slider-preview" class="virtual-body" dir="rtl">   ...element</div>但是，在我的 React 組件中，我想監(jiān)視這個(gè)目錄，以便我在里面做一些操作const Slider: FC<SliderProps> = props => {  let isRTL = false;  // I want this to actually reflect the current direction of the page  return (<div>{isRTL} ? 'RTL' : 'LTR' </div>)}所以我的問題是1/ 如何在 javascript 中獲取當(dāng)前主體方向2/ 我有一個(gè)改變方向的按鈕，基本上，它會(huì)改變 的dir屬性div wrapper，如何確保當(dāng)它改變時(shí)，Slider組件也會(huì)更新。
查看完整描述

1 回答

?
SMILET

TA貢獻(xiàn)1796條經(jīng)驗(yàn) 獲得超4個(gè)贊

動(dòng)態(tài)獲取dir取決于您的狀態(tài)管理方法（道具傳播、上下文、mobx、redux 等）。


這是一個(gè)簡(jiǎn)單的道具傳播方法的例子。


function Slider({ dir }) {

? return (

? ? <div dir={dir}>

? ? </div>

? );

};


function App() {

? const [dir, setDir] = useState("ltr");

? return (

? ? <Slider dir={dir} />

? );

}

https://codesandbox.io/s/gallant-sammet-u553m?file=/src/App.js


為了觀察父級(jí)的變化dir（如果它是外部組件），您可以使用MutationObserver來檢測(cè)道具的變化并相應(yīng)地更新狀態(tài)。


const [direction, setDirection] = React.useState(document.body.dir);

React.useEffect(() => {

? const observer = new MutationObserver((mutationsList, observer) => {

? ? if (mutationsList.some((mutation) => mutation.attributeName === "dir")) {

? ? ? setDirection(document.body.dir);

? ? }

? });

? observer.observe(document.body, {

? ? attributes: true

? });

? return () => observer.disconnect();

}, []);

查看完整回答
反對(duì) 回復(fù) 2023-05-11
  • 1 回答
  • 0 關(guān)注
  • 176 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)