React.js 庫就是將應用程序拆分為多個組件。每個組件都有自己的生命周期。 React 為我們提供了一些內置方法,我們可以在組件的 life-cycle 中的特定階段覆蓋這些方法。
在本文中,我們將知道如何使用 testInstance.findAllByProps() 方法
testInstance.findAllByProps() 方法用於查找所有具有提供道具的後代測試實例
創建 React 應用程序並安裝模塊:
步驟 1:使用以下命令創建 React 應用程序
npx create-react-app foldername
第 2 步:創建項目文件夾(即文件夾名稱)後,使用以下命令移至該文件夾。
cd foldername
第 3 步:創建 ReactJS 應用程序後,使用以下命令安裝所需的模塊:
npm i react-test-renderer
項目結構:如下圖所示。
範例1:
App.js
import React from 'react';
import TestRenderer from 'react-test-renderer';
// Defining our App Component
const App = () => {
// Function to demonstrate TestRenderer.findAllByProps() method
function func(){
const renderer = TestRenderer.create(
<div>
GeeksforGeeks
<div>
TestRenderer.findAllByProps() method
</div>
</div>
);
const myfindAllByProps = renderer.root;
console.log(myfindAllByProps.findAllByProps());
}
func();
// Returning our JSX code
return <>
</>;
}
// Exporting your Default App Component
export default App
輸出:
參考:https://reactjs.org/docs/test-renderer.html#testinstancefindallbyprops
相關用法
- ReactJS shouldComponentUpdate()用法及代碼示例
- ReactJS componentDidMount()用法及代碼示例
- ReactJS getSnapshotBeforeUpdate()用法及代碼示例
- ReactJS bind()用法及代碼示例
- ReactJS componentDidUpdate()用法及代碼示例
- ReactJS getDerivedStateFromError()用法及代碼示例
- ReactJS componentDidCatch()用法及代碼示例
- ReactJS forceUpdate()用法及代碼示例
- ReactJS unmountComponentAtNode()用法及代碼示例
- ReactJS findDOMNode()用法及代碼示例
- ReactJS isElement()用法及代碼示例
- ReactJS isCompositeComponent()用法及代碼示例
- ReactJS isElementOfType()用法及代碼示例
- ReactJS isCompositeComponentWithType()用法及代碼示例
- ReactJS isDOMComponent()用法及代碼示例
- ReactJS TestRenderer.toTree()用法及代碼示例
- ReactJS TestRenderer.toJSON()用法及代碼示例
- ReactJS TestRenderer.create()用法及代碼示例
- ReactJS TestRenderer.unmount()用法及代碼示例
- ReactJS testInstance.findAllTypes()用法及代碼示例
- ReactJS testInstance.findByProps()用法及代碼示例
注:本文由純淨天空篩選整理自dheerchanana08大神的英文原創作品 ReactJS testInstance.findAllByProps() Method。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。