如果您需要用戶等待語言設(shè)置完成，您可以從該模塊返回承諾。比如： let ready = false;const start = () => { return new Promise((res) => { if (ready) return res(i18next); apiDelegate.getTranslations().then((result) => { output = JSON.stringify(result); const tr_fr = 'translation: ' + JSON.parse(output); i18next .use(LanguageDetector) .use(initReactI18next) .init({ resources: { en: tr_fr, }, fallbackLng: 'fr', }); i18next.changeLanguage(navigator.language); }); ready = true; return res(i18next); });};export default start;

您可以使用key強(qiáng)制react卸載并重新裝載組件。鍵提供react關(guān)于一個(gè)渲染中的哪個(gè)元素對應(yīng)于下一個(gè)渲染中的哪個(gè)元素的附加信息。如果鍵不同，那么這就告訴react它們是不同的元素，即使它們的類型相同。 const App = () => { const [gameNumber, setGameNumber] = useState(); const resetGameView = () => { setGameNumber(prev => prev + 1); } return ( <div> <GameView key={gameNumber} /> </div> );}

如果activeMenu不是2，則類名將是false（無效） className={activeMenu === "2" && "active"} with this className={activeMenu === "2" ? "active" : ""} 如果activeMenu不是2，則className將是一個(gè)空字符串（有效） 所以，基本上正如錯(cuò)誤所說。className不是布爾屬性。 在控制臺中運(yùn)行下面的代碼，它與您的代碼基本相同。它將返回false false && "active" !== null

你可以在這樣的條件下放置元素 {isAdmin? <AdminNavbar> : <NormalNavbar> } OR 在導(dǎo)航欄組件視圖的不同菜單中

我們來分析一下這個(gè)問題,， 首先，您需要了解setState（）函數(shù)是異步的，在本質(zhì)上是同步的forEach循環(huán)中連續(xù)調(diào)用它會導(dǎo)致錯(cuò)誤的結(jié)果。 const [postItems, setPostItems] = useState([])useEffect(() => { const getPostData = async () => { try { await api.getData().then((res) => { const stateData = []; // make a temporary const to store your state to be set res.forEach((doc) => { stateData.push({ "location": doc.location, "date": doc.date, "text": doc.experience }); }); // finally set your state here setPostItems([...stateData]); }) } catch (error) { console.log(error.message); } } getPostData();}, []) 第二個(gè)問題存在于將每個(gè)狀態(tài)元素映射到的代碼段中 添加一個(gè)返回語句，如下所示， {postItem

我不熟悉codesandbox，似乎它在相應(yīng)的更新方面有一些問題。 但是如果您將路由從Userform移到App.js。這給了你什么？

考慮你的第一個(gè)問題 第二個(gè)實(shí)現(xiàn)是否做了第一個(gè)實(shí)現(xiàn)沒有做的事情？ 除了承諾更快，兩者完全相同。 一個(gè)比另一個(gè)更健壯嗎？ 第二種方法在許多框架和庫中更為常見，因?yàn)樗峁┝艘环N更好的鏈接方式，并提供了一種很好的catch錯(cuò)誤鏈接方式 有關(guān)更多信息，請參閱Promise vs setTimeout 例如react-testing-library中有waitForElementToBeRemoved

你正在關(guān)注的視頻非常舊，可能不再是最新的。請遵循安裝指南，然后遵循本指南。這會讓你在幾分鐘內(nèi)起床跑步。

好，好！現(xiàn)在我知道問題出在哪里了，首先我想你把這兩個(gè)文件放在一個(gè)組件中，如果是的話，就是這樣。 首先，在Order.js組件中導(dǎo)入Scanner.js。這樣地。 import Scanner from "./Scanner"; 然后在order組件中的任意位置渲染它，就像這樣。 <div className='form-group'> <label htmlFor='palette'>Palette</label> <input type='text' className='form-control' id='palette' name='palette' placeholder={currentOrder.palette} value={currentOrder.palette} onChange={handleInputChange} /> <Scanner/> </div> that's it Update 1 我發(fā)現(xiàn)您的代碼有一些問題： <BarcodeScannerComponent width={500} height={500} onUpdate={(err, result) => { if (result) setData(result.text); else setData("No

將回調(diào)傳遞給Child組件中的ref。 for (let a = 0; a < this.maxRow; a++) { objT.push(<Child ref={this.getChildRefs} />);} 您將通過回調(diào)函數(shù)的參數(shù)接收節(jié)點(diǎn)，將其推送到數(shù)組，然后數(shù)組將包含所有Child項(xiàng)。您可以通過索引訪問特定項(xiàng)。 getChildRefs = (node) =>{ const el = ReactDOM.findDOMNode(node) //To push the node only if it is not available in the array already if(el && !this.childRefs.contains(el)){ this.childRefs.push(node) } } 我使用了ReactDOM.findDOMNode，因?yàn)轭惤M件（Child）將返回ReactComponent的一個(gè)實(shí)例，findDOMNode將為您提供所需的DOM節(jié)點(diǎn)（HTML元素）。 Parent import ReactDOM from 'react-dom';class Parent extends Component { constructor(props) { super(props); this.childRefs

不要將可選標(biāo)志添加到組件中，而是考慮添加類似于（不完整代碼）的泛型類型： interface Props<T> & CommonProps { func(q: T): void; query: T;}function Component<T extends RG | RGIC = RG>(props: Props<T>) { // ...} T extends RG | RGIC = RG允許您設(shè)置可以使用的有效類型（RG或RGIC），如果用戶沒有傳入，則默認(rèn)為RG。然后，將根據(jù)給定給組件的內(nèi)容推斷出正確的類型（因此func中的參數(shù)在使用時(shí)不需要是re-typed）。 用法如下所示： return flag ? <Component<RGIC> query={queryIC} func={(q) => console.log(q)} /> : <Component<RG> query={query} func={(q) => console.log(q)} />;

您的組件無法擴(kuò)展input和textarea的props，因?yàn)樗鼈兙哂邢嗤Q但不同類型的屬性。 因此，您的組件應(yīng)該只擴(kuò)展其中一個(gè)，這取決于作為inputType傳遞的內(nèi)容。 這意味著這里需要泛型。 For example: type InputProps<T extends 'input' | 'textarea'> = { id: string; inputType?: T;} & JSX.IntrinsicElements[T] 在這里JSX.InstrinsicElements['tagnamehere']將返回react允許該標(biāo)記名使用的道具。T由inputType的值設(shè)置，該值為input或textarea。 現(xiàn)在，您只需將組件設(shè)置為通用組件，并將該通用組件傳遞給props類型： function MyComponent<T extends 'input' | 'textarea'>(props: InputProps<T>) { return <></>} 現(xiàn)在來測試一下： // no type errorsconst testInput = <MyComponent id="123" inputType='input' checked />const testTextarea = <

嘿，你這里有個(gè)拼寫錯(cuò)誤： <Route exact pat="/Stop/Nt" component={StopNt}/> 它應(yīng)該是路徑而不是pat。 <Route exact path="/Stop/Nt" component={StopNt}/>

它們幾乎是一樣的，但在第一種方法中，當(dāng)你使用AppHeader組件時(shí)，你的ide可以提示你這個(gè)組件需要一些重要的東西prop.(if你使用的是webStorm或phpStorm，你可以在使用組件的地方按ctl+space，然后看到這個(gè)道具）

為什么在MyMenuOptions.js中用MenuContainer包圍MenuOption const MyMenuOptions = ({ textSubMenu, value, toggle }) => { return ( <MenuContainer> <!----------- you need to remove this --> <MenuOption onSelect={toggle} style={styles.sousMenu}> <CheckBox/> </MenuOption> </MenuContainer> <!---------- you need to remove this --> );}; 您的步驟應(yīng)該是： App.js文件一定是這樣的 import { MenuProvider } from 'react-native-popup-menu';export const App = () => ( <MenuProvider> <YourApp /> </MenuProvider>); MenuContainer.js file const MenuContainer = ({ nameMenu, childre